Osservare un'espressione dall'interno di una direttiva

Question

Fondamentalmente, come posso ascoltare i cambiamenti in un'espressione all'interno di una direttiva?

---

Sto utilizzando la non documentata ng-required richiedere condizionalmente un certo campo:

<input type="checkbox" ng-model="partner" checked /> 
<input ng-model="partnerName" placeholder="required" ng-required="partner" /> 

Questa grande opera (here's the Plunkr). L'unico problema è che mantiene il testo "richiesto" placeholder, indipendentemente dal fatto che sia effettivamente necessario.

---

Così, ho deciso di creare la mia direttiva. Ecco come dovrebbe funzionare:

<input ng-placeholder="{ 'required': partner }" /> 

L'idea è simile a quella di angolare ng-class, ma non ho modo per ottenere questo risultato. Ecco quello che ho finora:

app.directive('ngPlaceholder', function ($parse) { 
    return { 
     restrict: 'A', 
     link: function (scope, element, attrs) { 
      console.log(scope.$eval(attrs.ngPlaceholder)); 
     } 
    } 
}); 

che registra un oggetto bello che posso usare per determinare il valore placeholder:

{ required: true } 

ma come faccio poi agganciare nel ciclo $digest/$apply aggiornare l'attributo placeholder ogni volta che cambia partner?

Answer 1

È questo quello che vuoi? plunker

l'idea di base per la funzione di collegamento dovrebbe essere come

link: function (scope, element, attrs) { 
     scope.$watch(attrs.xngPlaceholder, function (newVal, oldVal, scope) { 
      element.removeAttr('placeholder'); 
      var att = ''; 
      angular.forEach(newVal, function (elm, key) 
       att += elm ? (key + ' ') : ''; 
      }); 
      element.attr('placeholder', att); 
     }, true); 
    } 

Answer 2

Un approccio alternativo, che non richiede una direttiva:

placeholder="{{{true: 'required', false:''}[partner]}}" 

È possibile che questo crea oggetto {true: 'required', false:''} e poi gli indici in oggetto utilizzando il valore corrente di partner.