Javascript 以一种方式重新呈现数据绑定或重复_Javascript_Css_Html

Javascript 以一种方式重新呈现数据绑定或重复

javascript css html

Javascript 以一种方式重新呈现数据绑定或重复,javascript,css,html,Javascript,Css,Html,我在ng repeat中使用单向绑定。当数组值更改时，我仍然希望刷新ng repeat 请提出你的想法：示例： <html ng-app="todoApp"> <head> <title> TO DO List </title> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootswatch/3.1.1/readable/bootstrap.min.c

我在

ng repeat

中使用单向绑定。当数组值更改时，我仍然希望刷新

ng repeat

请提出你的想法：

示例：

<html ng-app="todoApp">

<head>
  <title>
    TO DO List
  </title>
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootswatch/3.1.1/readable/bootstrap.min.css">
  <link rel="stylesheet" href="style.css">
  <script data-require="angular.js@*" data-semver="1.3.1" src="//code.angularjs.org/1.3.1/angular.js">
  </script>
  <script>
    var todoApp = angular.module("todoApp", []).config(function($compileProvider, $httpProvider) {
      $compileProvider.debugInfoEnabled(true);
    });

    todoApp.controller("ToDoCtrl", function($scope) {

      $scope.data = [12, 23, 45, 67, 89];
      $scope.add = function(dtata) {
        $scope.data.push(dtata);
      }
    });
  </script>

</head>

<body ng-controller="ToDoCtrl">

  <!-- ...elements omitted for brevity... -->

  <div class="panel">
    <div class="input-group">
      <input class="form-control" />
      <input type="text" ng-model="numberData" />
      <button type="submit" ng-click="add(numberData)">
        add
      </button>
    </div>
    <table class="table table-striped">
      <thead>
        <tr>
          <th>
            Numbers
          </th>
        </tr>
        <tr ng-repeat="de in ::data">
          <th>
            {{::de}}
          </th>
        </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
  </div>
</body>

</html>


待办事项清单
var todoApp=angular.module（“todoApp”，[]）.config（函数（$compileProvider，$httpProvider）{
$compileProvider.debugInfoEnabled（true）；
});
todoApp.controller（“ToDoCtrl”，函数（$scope）{
$scope.data=[12,23,45,67,89]；
$scope.add=函数（dtata）{
$scope.data.push（dtata）；
}
});
添加
数字
{{：：de}

代码可以在
中找到，使用“：”语法用于一次性绑定，不应与单向绑定混淆
ng repeat
本质上是一种方式。也就是说，添加dom元素不会神奇地将数据项添加到模型中。一次性绑定的真正目的是通过明确声明用于渲染的数据不会更改（或者如果更改，我们将不关心）来提高angular摘要周期的性能
话虽如此，您可以从
{{：：de}
中删除
：：
，以消除检查每个项的更改的开销。如果
数据
变得非常大，这将避免性能下降