AngularJS liste d'affichage à partir d'un tableau

J'ai un contrôleur qui renvoie un tableau, je vais essayer d'afficher chaque élément de ce tableau comme une liste.

Ce que je suis tente de faire, ce qui n'est pas de travail:

<li ng-repeat="Name in names">
    <a ng-controller="PostsCtrl" href="#">{{response.text}}</a>
</li>

réponse.texte retourne un tableau à partir du contrôleur.

Je suis également se demander, quelle est la valeur de la ng-repeat attribut censé être, toute chaîne unique?

Merci!

  • Ce n' names et response ressembler? Je sais que vous mentionnez un tableau mais sont tous les deux d'un tableau?
  • Que diriez - {{ JSON.stringify(la réponse.de texte) }} ?
InformationsquelleAutor Abushawish | 2014-11-10
  1. 13

    Définir le tableau dans votre contrôleur avec l' $portée variable: 

    app.controller('PostsCtrl', function($scope) {
    $scope.response = { text: ['hello', 'world'] };
}

    Puis utilisez ng-repeat sur la VARIABLE, pas le contrôleur.

    <div ng-controller="PostsCtrl">
    <ul>
        <li ng-repeat="name in response.text"><a href="#">{{name}}</a></li>
    </ul>
</div>

    Le contrôleur est seulement utilisé pour définir ce qu' $portée des variables que vous pouvez utiliser dans cette section, et n'est pas utilisée comme une variable elle-même.

    • Merci pour votre aide!
    InformationsquelleAutor tcase360
  2. 2

    ngRepeat est fondamentalement juste comme un for boucle. Il n'y a pas de valeur par défaut, vous avez juste besoin de donner les données que vous souhaitez parcourir. Ainsi, lorsque vous êtes en train de faire un ng-repeat="name in names", il est similaire à faire quelque chose comme for(var name in names){} dans la plaine du javascript. Pour que cela fonctionne correctement, vous devez transmettre ces données au modèle par l'intermédiaire de votre $scope, en tant que tel:

    JS:

    var myApp = angular.module('myApp', []);

myApp.controller('PostsCtrl', ['$scope', function($scope){
    //Here the array would be your response.text:
    $scope.names = ['John', 'Jessie', 'Johanna', 'Joy', 'Mary', 'Peter', 'Sebastian', 'Erika', 'Patrick', 'Samantha'];

}]);

    HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
    <div ng-controller="PostsCtrl">
        I have {{names.length}} friends. They are:
        <ul>
          <li ng-repeat="name in names">
            [{{$index + 1}}] {{name}}.
          </li>
        </ul>
    </div>
</div>

    Pour de plus amples informations, veuillez visiter: https://docs.angularjs.org/api/ng/directive/ngRepeat

    • Merci beaucoup, désolé que je ne peux pas sélectionner plusieurs réponses correctes.
    InformationsquelleAutor Gerson Goulart
  3. 1

    Vous avez probablement votre contrôleur sur le mauvais attribut de là, sauf si vous voulez un nouveau contrôleur pour chaque élément du tableau.

    La deuxième question, "response.text retourne un tableau à partir du contrôleur." Est-ce que le tableau que vous voulez répéter?

    <div ng-controller="PostsCtrl">
  <li ng-repeat="item in response.text">
      <a href="#">{{item}}</a>
  </li>
</div>

    Et puis la troisième question, quelle est la valeur de la ng-repeat attribut censé être: c'est censé être la valeur d'un tableau valide sur votre $scope ou viewModel. Donc, response.text serait un élément valide à mettre sur le ng-repeat puisque c'est un tableau. Comme je l'ai ci-dessus, vous avez maintenant une item objet pour chaque élément de reponse.text. Si c'est aussi loin que vous voulez aller, vous pouvez simplement imprimer {{item}} -- si item a des propriétés, vous pourriez faire quelque chose comme, par exemple, {{item.someProperty}}

    • Merci, dommage que je ne peut pas sélectionner plusieurs réponses correctes!
    InformationsquelleAutor Tom