angularjs - data - ngmodel



Comment accéder aux attributs du composant v1.5 d'Angularjs? (1)

J'utilise le composant v1.5, qui est essentiellement (pour autant que je sache) un wrapper pour les meilleures pratiques.

Plus d'informations sur la version 1.5 du composant peut être trouvé ici: http://toddmotto.com/exploring-the-angular-1-5-component-method/

J'ai ce qui suit:

<span>Correclty showing: {{ data.type }}</span>
<book class="details" type="data.type"></book>

Et c'est la définition du composant:

angular
.module('app')
.component('book', {
    bindings: {
        type: '='
    },
    template: function($element, $attrs) {
        // Have tried A):
        // console.log($attrs.type); // <- undefined

        // And B):
        $attrs.$observe('type', function(value) {
            console.log(value); // <- undefined
        });

        // But.. C):
        return "This works though {{ book.type }}"; // <- renders
    }
});

Les deux variations A) et B) retournent undefined . C) rend correctement.

Existe-t-il un moyen d'accéder aux attributs dans la fonction de modèle avant de renvoyer la chaîne de modèle?


Dans 1.5, templateUrl prend maintenant les injectables selon les docs: https://docs.angularjs.org/guide/component . Si vous utilisez ng-srict-di, vous obtiendrez une erreur sauf si vous spécifiez les injectables .... J'utilise ng-annotate pour sauvegarder les maux de tête et garder le code propre. Voici un exemple (en TypeScript):

  import IRootElementService = angular.IRootElementService;
  import IAttributes = angular.IAttributes;

  angular.module('app').component('book', {

      /*@ngInject*/
      templateUrl($element:IRootElementService, $attrs:IAttributes) {
           // access to the $element or $attrs injectables
      }

  });

ou sans ng-annotate dans vanille JS:

  angular.module('app').component('book', {    
      templateUrl: ['$element', '$attrs', function($element, $attrs) {
           // access to the $element or $attrs injectables
      }],
  });




web-component