javascript – 在DOM中动态重新加载重复数据

前端之家收集整理的这篇文章主要介绍了javascript – 在DOM中动态重新加载重复数据前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我看到以下代码

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

当我从项目中添加/删除新值时,我希望动态触发ng重复.如同一个新的元素,如果一个新的元素被添加到项目的开始,那么它应该在DOM开始时动态地呈现给DOM,同样的,如果一个元素被添加到项目的末尾应该被渲染为最后一个列表项. DOM的这种动态变化可能在角度吗?

解决方法

ng-repeat应该以这种方式开箱即用.但是,您需要推或不移动数组,以便正确的手表将触发. Angular将通过引用来跟踪阵列.

这是一个working 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');
    }
  });
原文链接:https://www.f2er.com/js/151980.html

猜你在找的JavaScript相关文章