La liaison tableau de la directive variable en AngularJS

Que j'essaie de faire un tableau dans un modèle, afin que je puisse utiliser les personnes les valeurs de celle-ci. Mon problème est que l'attribut se transforme en une chaîne de caractères une fois à l'intérieur de mon modèle il n'est donc plus accessible que {{var[0]}} et que plutôt retourne le premier caractère de la chaîne "string", généralement "["

Ici est une forme simplifiée de l'installation des données:

"varForward": ["100", "1"],
"varBack": ["1", "100"]

Ici est simplifié partie du fichier HTML qui interagit avec les données:

<my-customer-vars value="{{varForward}}">
    </address-numbers>
<my-customer-vars value="{{varBack}}">
    </address-numbers>

et enfin voici une partie qui est CENSÉE remplacer la balise personnalisée avec mes propres trucs:

directive('myCustomerVars', function($compile) {
    return {
        restrict: 'E',
        scope: {
            value: "@"
        },
        template:
        '<div>'+
          '<p class="body-text">Some stuff goes here</p>'+
          '<input type="text" name="firstinput" value="{{value[0]}}"> - '+
          '<input type="text" name="secondinput" value="{{value[1]}}">'+
        '</div>',
        replace: true
    }
});

Donc ici, je suis, si j'ai essayer d'utiliser la valeur[0] j'ai [ Si j'essaie d'obtenir la valeur[1] - je obtenir " et ainsi de suite. Est-il de l'aide sur l'utilisation des tableaux à l'intérieur du modèle de la directive?

InformationsquelleAutor Organiccat | 2013-02-04

45

Vous avez besoin de changer le "@" dans le "=" et de passer dans le tableau sans les {{ }}

comme ceci:
```
<my-customer-vars value="varForward">
    </my-customer-vars>
<my-customer-vars value="varBack">
    </my-customer-vars>
```
directive:
```
directive('myCustomerVars', function($compile) {
    return {
        restrict: 'E',
        scope: {
            value: "="
        },
        template:
        '<div>'+
          '<p class="body-text">Some stuff goes here</p>'+
          '<input type="text" name="firstinput" value="{{value[0]}}"> - '+
          '<input type="text" name="secondinput" value="{{value[1]}}">'+
        '</div>',
        replace: true
    }
});
```
Ce qui se passe parce que chaque expression à l'intérieur d'un directuve attribut défini par un @ obtient évalué uniquement sous la forme d'une chaîne de caractères, et dans l'autre sens il obtient évalué comme expression de liaison. (avec 2 voies de liaison, donc attention).
- Merci, cela fonctionne parfaitement! Je ne suis pas complètement à l'aise avec la portée des variables, mais qui a aidé à éclaircir beaucoup de questions que j'avais, y compris la façon de les utiliser.
- Maintenant que nous sommes de passage des modèles au lieu de valeurs, je suggère model="varForward" et puis scope: { model: '=' }.
- Est-ce la meilleure façon de prendre du tableau et le mettre dans un template? Je suis assez nouveau demandais si il existe des alternatives.
- cela fonctionne comme de 1,08 car elle ne semble pas être pour moi
- Yep, il n'a pas changé
InformationsquelleAutor Shai Reznik - HiRez.io
16

Si vous préférez ne pas créer un isolat champ d'application de la directive (comme lors de la création de validation personnalisée directives), vous pourriez passer le tableau en tant que:
```
<my-customer-vars model="varForward">
```
Puis lire la valeur dans la fonction de liaison de la directive:
```
directive('myCustomerVars', function($compile) {
    return {
        restrict: 'E',
        link: function (scope, elm, attrs, ctrl) {
            var myVars = scope[attrs.model]; //<--- took a time to figure out
            console.log(myVars);
        }
    }
});
```
- cette réponse est à partir d'un il ya longtemps, je suppose que sur le moment Angulaire 1.1 ou 1.2. Peut-être qu'il ne fonctionne plus dans les versions plus récentes. Je n'utilise pas Angulaire plus.
InformationsquelleAutor Danita
6

Juste pour ajouter à la réponse de Danita, vous devrez utiliser $eval pour le chargement de la portée de la variable:

Il suffit de changer
```
var myVars = scope[attrs.model]; 
```
à
```
var myVars = scope.$eval(attrs.model); 
```
- Merci. Je souhaite que cela est mieux expliqué dans la documentation.
InformationsquelleAutor Sohan Soni
0

Juste un autre point de vue - si le problème est juste de la gestion d'un tableau de chaînes de caractères dans angulaire de l'application, je voudrais utiliser une des options suivantes (ou similaire):
Sauf si vous êtes pratiquant de la création de votre propre angulaire directives (ensuite ignorer ma réponse)

InformationsquelleAutor Alexander

Vous devez vous connecter pour publier un commentaire.