Question

这里的代码太多，所以请原谅我。

我有一个基本的应用程序，它有一个模块，控制器和ng-view / routProvider。

如果我执行以下操作，在我的控制器中，console.log(angular.element('div').length)控制台会吐出我有10个DIV元素。这是对的。

但是，当我尝试通过angular.element('div').remove()操纵所述DOM元素时，只会移除ng-view之外的DOM元素。

有人可以解释一下发生了什么吗？非常感激。

编辑：我刚刚注意到，如果我执行删除操作然后运行angular.element（＆＃39; div＆＃39;）。length，长度将更改为0，但ng-view内容保持不变。所以我的猜测是删除元素后视图没有更新..

Answer 1

如果您使用的是AngularJs，那么您需要让DOM与您的同步数据来自AngularJs。

这是最简单的例子。

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope) {
  $scope.items = [{
    name: 'A'
  }, {
    name: 'B'
  }, {
    name: 'C'
  }, {
    name: 'D'
  }, ];

  $scope.remove = function() {
    $scope.items.splice(1, 2);
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="MainCtrl">

  <ul ng-repeat="item in items">
    <li>{{ item.name }}
  </ul>

  <button type="button" ng-click="remove()">remove</button>

</div>

最初，在用户点击“删除”按钮之前，数组中有4个项目从数组中删除2个项目。 DOM会根据数组的更改自动更新。

DOM操作不适用于ng-view

1 个答案: