Directive Angularjs: Portée isolée et attrs

Question

Veuillez voir l'exemple ici

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);
...

Angulaire besoins en symbol , max, readonly doit être défini dans les isolés objet de l'étendue de l'accès à partir de parent.

il est utilisé ici

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

Alors, quel est le but de l' attrs? Ne peut-on pas accéder à tous les attributs traversé attrs. Pourquoi ne peut-on pas accéder à la valeur de max comme attrs.max au lieu de scope.max

Pourquoi attribuer comme attrs.max = scope.max ?

Depuis cette application est écrite par Angulaire auteurs, j'attends une raison.

merci.

Answer 1

quel est le but de attrs?

Attributs définis sur le même élément que votre directive ont un peu fins:

1. Ils sont le seul moyen de transmettre des informations dans une directive qui utilise un isolat portée. Depuis la directive isoler la portée n'a pas fait hériter de la portée parent, nous avons besoin d'un moyen de spécifier ce que nous voulons passer à l'isoler de la portée. '@', '=', et '&' dans l'objet "hash" par conséquent, chaque besoin d'un attribut pour spécifier les données/l'information est passée.
2. Ils servent comme une inter-directive mécanisme de communication. (E. g., La gestion de la communication entre les indépendants directives AngularJS independenly)
3. Ils normaliser les noms d'attribut.

Ne peut-on pas accéder à tous les attributs passé à travers attrs?

Oui vous pouvez, mais

1. vous n'aurez pas de liaison de données.
   '@' met en place une sorte de "chaîne" de la liaison de données (parent → directive isoler le champ d'application) Avec @ la valeur que vous voyez/obtenir dans la directive est toujours une chaîne de caractères, donc ne l'utilisez pas si vous êtes en essayant de passer d'un objet à votre directive.
   '=' met en place les deux sens de la liaison de données (parent ↔ directive isoler le champ d'application).
   Sans liaison de données, la directive ne peut pas $regarder ou $observer de modèle et/ou des modifications de données automatiquement.
2. les valeurs d'attribut avec {{}}s va vous causer des problèmes, car ils ne seront pas interpolées.
   Supposons que nous avons <my-directive name="My name is {{name}}"> et de la portée parent a $scope.name='Mark'. Puis, à l'intérieur de la fonction de liaison, console.log(attrs.name) résultats en undefined.
   Si le nom est un isolat champ d'application bien défini par"@", puis attrs.$observe('name', function(val) { console.log(val) }) résultats en My name is Mark. (À noter qu'à l'intérieur de la fonction de liaison, $observer() doit être utilisée pour obtenir la valeur interpolée.)

Pourquoi ne peut-on pas accéder à la valeur de max comme attrs.max au lieu de portée.max

répondu plus haut

Pourquoi attribuer comme attrs.max = portée.max ?

La seule raison pour laquelle je peux penser pour le faire, c'est dans le cas ou une autre directive a besoin de voir cet attribut/valeur (c'est à dire, l'inter-directive de la communication). Cependant, les autres la directive aurait besoin de courir après la présente directive pour ce travail (qui peut être contrôlée quelque peu avec l' priority directive de configuration).

Résumé: dans une directive avec un isolat portée, normalement, vous ne voulez pas utiliser attrs. (Je suppose que cela pourrait être un moyen d'envoyer de l'initialisation des données/valeurs dans une directive -- c'est à dire, si vous n'avez pas besoin de liaison de données pour ces valeurs et que vous n'avez pas besoin d'interpolation.)

Answer 2

À l'aide de attrs vous êtes en mesure d'accéder aux attributs définis dans votre balise html comme

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

Dans ce cas, vous aurez accès au symbole et readonly attributs. Chaque attribut que vous définissez dans votre personnalisé directive sera disponible à la attrs variable.

Le bloc:

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

Permettra d' analyser et d'attribuer l'actuel champ d'application.max valeur ou 5, si inexistante, à la portée.max et attrs.max. De cette façon, après la cession, vous pouvez lire à partir de attrs.max. Avant que le attrs.max propriété non défini.

L'inspection de l'fmRating.js source, je ne sais pas pourquoi/où/quand ce morceau de code est utilisé.