javascript - 如何使用angularjs将div附加到一个div中

Question

 <div data-ng-controller="maincontrol">
   <div class="main">
   </div>
  <button data-ng-click="submit()">click</button>
 </div>

当我单击单击按钮时，我想在主 div 中附加一个 div。我想为每次点击添加一个新的 div(动态地)。我还想知道子 div 是否存在。

我会在 jquery 中这样做

$('main').append();

我将在 append() 中传递 div；

但是如何使用 angular..js 来做呢？

Answer 1

使用指令可能是一种解决方案，但它仍然太接近 jQuery。当您使用 Angular 时，您必须以不同的方式思考。

jQuery 是程序化的。

1- 我在 dom 中找到一个元素

2-我正在做一些事情

3- 我在 dom 中添加、删除、更新元素

angular 是声明式的

• 您定义您的数据

• 您定义数据的显示方式(使用 ng-repeat、ng-class 等)

然后..

• 当您使用数据时， View 会自动更新。

如果你想正确地玩 Angular 你应该做这样的事情:

模板:

 <div class="main">
    <div ng-repeat="stuff in stuffs"><h1>{{stuff.title}}</h1> <p>{{stuff.content}}</p></div>
 </div>

Controller :

function MainCtrl() {
    $scope.stuffs = [];
    $scope.submit = function() {
       $scope.stuffs.push({title: 'Hello', content: 'world'});
    }
}