Angularjs动态添加了指令范围问题

Question

我在这里有例子，

Angularjs Circle Directory

我有点击按钮动态添加的目录。添加圆形目录后，我将增加圆形目录中的计数器。但是这里的问题是所有目录都使用相同的值进行更新，这是不正确的。

请告诉我，如何逐个增加每个目录的计数器。

Answer 1

Plunkr

好的，你对JavaScript有一点了解，但对于Angular如何处理这个问题有一个完整的文化。

您的主要问题是，您在动态添加Angular及其数据之外的元素，在语义上，您只是尝试添加和删除屏幕上的圈数。为此，您可以在ng-repeat指令上使用circel。简单。

一些相关修复

• 尝试使用$(document).ready({ //running bindings })或相关的Angular指令
，而不是ng-click
• 考虑保持缩进清洁
• 您可以使用Angular的$index而不是增加窗口范围变量
• 从语义上讲，scope.add和scope.remove函数不是圆的属性，它们是圆圈外的控制按钮。尝试将它们移动到控制器范围，不是指令控制器，应用程序控制器。
• 每当你希望每个指令单元都有自己的作用域时，在指令返回对象中声明{ scope: true }，或者单独声明每个作用域属性，例如： { scope: { myProp: '=' } }
• 关于添加和删除：Angular方式非常非常非常非常地追加/添加像你正在将jQuery与Angular混合的元素;相反，ng-repeat将负责添加/删除DOM元素，这些元素也遵循“单一事实来源”方法。
• 我认为你的意思是“指令”而非“目录”