Progressivement concaténer des chaînes à l'intérieur Angulaire du modèle (c'est à dire dans la vue)

À l'intérieur d'un ng-repeat, je suis en train d'ajouter un peu de texte dans une variable.

La vraie raison pour laquelle je fais cela, c'est parce que j'ai un modèle récursif et je veux continuer à ajouter de la même variable. Mais j'ai créé un exemple simple pour démontrer qu'une partie du problème, je vais avoir dans l'espoir qu'il peut m'aider à résoudre les autres problèmes.

Je m'attends à l'écran pour imprimer tous les numéros, suivi par un " b " chacun, comme

1b
2b
3b
...

Au lieu de cela, il imprime 

1bbbbbbbbbbb
2bbbbbbbbbbb
3bbbbbbbbbbb
...

Pourquoi?

Voici mon JSFiddle: http://jsfiddle.net/fd1f6yso/1/

InformationsquelleAutor CodyBugstein | 2014-12-21
  1. 2

    Pourquoi?

    Parce que c'est la façon de liaison de données qui fonctionne par défaut: chaque valeur de temps de num la modification de la variable, l'expression est recalculé - modification de la num encore, et encore, et encore. Finalement, il s'arrête; avez-vous vérifié la console, vous auriez vu beaucoup de " 10 $digest itérations atteint des erreurs. Et c'est pourquoi vous voyez exactement 10 b imprimé dans chaque ligne.

    Il est assez facile de se débarrasser du problème, si vous voulez le même nombre de b imprimés à chaque étape:

    <div ng-app="App" ng-controller="ctrl">
   <div ng-repeat="num in [1, 2, 3, 4, 5, 6] track by $index">
      <label>{{num + 'b'}}</label>
   </div>
</div>

    Si vous voulez construire une sorte de pyramide, l'incrémentation de la b-comte, c'est un peu plus compliqué. Voici une démarche possible:

    App.controller("ctrl",function ($scope){
    $scope.myNum = 0;
    $scope.decorateWithB = function(num) {
        return num + Array(+num + 1).join('b');
    };
});

<div ng-app="App" ng-controller="ctrl" ng-init="acc='b'">
     <div ng-repeat="num in [1, 2, 3, 4, 5, 6] track by $index">
         <label>{{decorateWithB(num)}}</label>
     </div>
</div>

    Démo.

    • Malheureusement, je n'ai pas demandé de la meilleure façon possible pour ce que je suis confus. Je reasked ici: stackoverflow.com/questions/27590337/...
    • Vous avez demandé tout à fait ok, mais vous n'avez pas vraiment vérifier ma réponse. ) Voici le la solution pour votre problème - comme vous le voyez, il y a la même approche: déplacer le récursive à l'intérieur du contrôleur.
    • La façon dont je suis en train de faire récursive est en appelant un modèle à l'aide de ng-include et l'appeler à partir de l'intérieur de lui-même
    InformationsquelleAutor raina77ow
  2. 4

    avec {num = (num+'b')

    vous êtes à la mise à jour des num de référence des précédentes itérations ainsi l'ajout de " b " à chaque refrence à chaque fois et obtenir des mises à jour comme

    1 + "b" => 1b + "b" => 1bb + "b" donc, sur

    2 + "b" => 2b + "b" => 2bb + "b" donc, sur

    afin de ne pas affecter seulement ajouter "b" , comme

    (num+'b')

    Démo

    JS:

    var App = angular.module("App",[]);

App.controller("ctrl",function ($scope){
    $scope.myNum = 0;
});

    HTML:

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="App" ng-controller="ctrl">
         <div ng-repeat="num in [1, 2, 3, 4, 5, 6]">
             <label>{{ (num+'b')}}</label>
         </div>
    </div>

    • Malheureusement, je n'ai pas demandé de la meilleure façon possible pour ce que je suis confus. Je reasked ici: stackoverflow.com/questions/27590337/...
    • oui vous avez fait un bon travail pour faire de la question, il n'était pas obvoius ici, laissez-moi voir là 🙂 @Imray
    InformationsquelleAutor A.B