Dynamisch nachladen ng-repeat-Daten in das DOM

Ich habe folgenden code in meine view:

<li ng-repeat="i in items">{{i.id}}</li>

Möchte ich die ng-repeat zu werden, auslöste dynamisch, wenn neue Werte Hinzugefügt werden/entfernt vom items. Wie in, wenn ein neues element Hinzugefügt werden Anfang items dann sollte es dynamisch dargestellt, um den DOM am Anfang und ebenso, wenn ein element Hinzugefügt wird, um das Ende der items das Element dargestellt werden soll, wie der Letzte Punkt der Liste. Ist das dynamische ändern des DOM möglich in eckige?

Ja, sollte funktionieren out of the box so. Stellen Sie sicher, dass push und unshift in das bestehende array. Eckig wird track-by-reference.
Wie angular js bietet runtime-Daten verbindlich, so dass jeder Bereich-Wert bei der Aktualisierung führen, anwenden() des dom-UI können Sie finden es hier docs.angularjs.org/api/ng.directive:ngController

InformationsquelleAutor Amal Antony | 2013-11-13

  1. 10

    ng-repeat sollte so funktionieren out of the box. Allerdings müssen Sie push oder unshift in das array so, dass die richtige Uhr Feuer. Angular verfolgt das array als Referenz.

    Hier ist ein arbeiten plunker.

    HTML:

    <html ng-app="myApp">

  <head>
    <script data-require="angular.js@*" data-semver="1.2.0" src="http://code.angularjs.org/1.2.0/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="Ctrl">
    <h1>Hello Plunker!</h1>
    <div ng-repeat="item in items">
      {{ item }}
    </div>
    <button ng-click="add()">Add</button>
  </body>

</html>

    JS:

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

myApp.controller('Ctrl', function($scope) {

    $scope.items = ['hi', 'hey', 'hello'];

    $scope.add = function() {

      $scope.items.push('wazzzup');
    }
  });
    Danke, aber ein setTimeOut um ein element anzuhängen scheint nicht zu dynamisch hängen Sie an die Liste.
    Müssen Sie $timeout Winkel-Dienst oder $scope.$apply zum auslösen der Winkel $digest.
    Ich habe aktualisiert die plunker zu zeigen, mit $timeout.
    Ich war ursprünglich testing ng-repeat mit setTimeout das war es, was mich dazu veranlasst, die Frage zu stellen. Vielen Dank für Ihre Hilfe.
    Aha, das ist ein guter Tipp. so ersetzt eine ganze $Umfang.Daten.array mit ['element1', 'element2'] etc. zum Beispiel wird NICHT aktualisiert die Ansicht automatisch. verwenden Sie ein $scope.$gelten Verschluss (siehe für mehr info : jimhoskins.com/2012/12/17/angularjs-and-apply.html), damit angular weiß etwas aktualisiert hat, die außerhalb der Sachen, die er beobachtet, offenbar.

    InformationsquelleAutor Davin Tryon

  2. 1

    Können Sie die $rootScope intead von $scope, um die Eigenschaft items.

    Diese Weise die-Eigenschaft ist global und wird aktualisiert.

    myApp.controller('Ctrl', function($scope, $rootScope) {

    $rootScope.items = ['hi', 'hey', 'hello'];

    $scope.add = function() {
        $rootScope.items.push('wazzzup');
    }
});

    InformationsquelleAutor Fabien Thetis

Schreibe einen Kommentar