direttiva Angularjs: portata e attrs Isolato

Question

Si prega di vedere l'esempio here

foodMeApp.directive('fmRating', function() { 
    return { 
    restrict: 'E', 
    scope: { 
     symbol: '@', 
     max: '@', 
     readonly: '@' 
    }, 
    require: 'ngModel', 
    link: function(scope, element, attrs, ngModel) { 

     attrs.max = scope.max = parseInt(scope.max || 5, 10); 
... 

esigenze angolari symbol, max, readonly da definire nel campo di applicazione l'oggetto isolato di accedervi dal campo di applicazione genitore.

viene utilizzato here

<fm-rating ng-model="$parent.restaurant.price" symbol="$" readonly="true"></fm-rating>

Quindi, qual è lo scopo della attrs? Non è possibile accedere a tutti gli attributi passati attraverso attrs. Perché non è possibile un valore di accesso massimo pari a attrs.max anziché scope.max

Perché assegnare come attrs.max = scope.max?

Poiché questa app è stata scritta da autori angolari, mi aspetto un motivo.

grazie.

Answer 1

qual è lo scopo di attrs?

Attributi definiti sullo stesso elemento come direttiva hanno un paio di scopi:

1. sono l'unico modo per passare le informazioni in una direttiva che utilizza un ambito isolato. Dato che la direttiva isolare l'ambito non eredita prototipicamente dall'ambito genitore, abbiamo bisogno di un modo per specificare cosa vogliamo passare all'isolamento dell'isolato. '@', '=' e '&' nell '"oggetto hash", quindi ognuno richiede un attributo per specificare quali dati/informazioni vengono passati.
2. Servono da meccanismo di comunicazione inter-direttiva. (Ad es., Managing communication between independent AngularJS directives independently)
3. Sono normalize i nomi degli attributi.

non si può accedere a tutti gli attributi passati attraverso attrs?

Sì, è possibile, ma

1. non avrà vincolanti tutti i dati.
   '@' imposta un collegamento di stringa "unidirezionale" (ambito principale → per l'ambito isolato) Con @ il valore visualizzato/ottenuto nella direttiva è sempre una stringa, quindi non utilizzare questo se si sta tentando di passare un oggetto alla tua direttiva.
   '=' imposta l'associazione dati bidirezionale (ambito principale ↔ per l'isolamento della direttiva).
   Senza l'associazione dati, la direttiva non può $ guardare o $ osservare automaticamente modifiche al modello/ai dati.
2. valori di attributo con {{}} s causano problemi, dal momento che non saranno interpolati.
   Supponiamo di avere <my-directive name="My name is {{name}}"> e l'ambito genitore ha $scope.name='Mark'. Quindi, all'interno della funzione di collegamento, i risultati console.log(attrs.name) in undefined.
   Se nome è una proprietà di ambito isolato definita con '@', quindi i risultati attrs.$observe('name', function(val) { console.log(val) }) in My name is Mark. (Si noti che all'interno della funzione di collegamento, $ osservare() deve essere utilizzato per ottenere il valore interpolato.)

Perché non è possibile un valore di accesso di max come attrs.max invece di scope.max

risposto sopra

Perché assegnare indietro come attrs.max = scope.max?

L'unica ragione per cui posso pensare di fare questo è nel caso che qualche altra direttiva abbia bisogno di vedere questo attributo/valore (cioè comunicazione inter-direttiva). Tuttavia, l'altra direttiva dovrebbe essere eseguita dopo questa direttiva affinché funzioni (che può essere controllata in qualche modo con l'impostazione della direttiva priority).

Riepilogo: in una direttiva con un ambito isolato, normalmente non si desidera utilizzare attrs. (Suppongo che potrebbe essere un modo per inviare dati/valori di inizializzazione in una direttiva - cioè, se non hai bisogno di associazione dati per questi valori e non hai bisogno di interpolazione.)

Answer 2

Utilizzando attrs si sono in grado di accedere agli attributi definiti nel tag html come

<fm-rating ng-model="$parent.restaurant.price" symbol="$" readonly="true"> 

Quindi in questo caso si avrà accesso al simbolo e sola lettura attributi. Ogni attributo definito nella direttiva personalizzata sarà disponibile per la variabile attrs.

Il blocco:

attrs.max = scope.max = parseInt(scope.max || 5, 10); 

Will analizzare e assegnare l'attuale valore scope.max o , se inesistente, lo scope.max e attrs.max. In questo modo, dopo il compito, puoi leggere da attrs.max. Prima che la proprietà attrs.max non sia definita.

Ispezionando il sorgente fmRating.js non so perché/dove/quando viene utilizzato questo pezzo di codice.