2

在过去的 3-4 天里，我研究了 Angular js。从外观上看（带有教程和视频），它使用起来非常直观。但是当我真正开始用 Angular js 替换我当前的 Web 应用程序代码时，我在启动时遇到了很多问题。

例如，如果在某个事件中，我希望将一些 HTML 添加到 DOM 中某个已经存在的元素中，那么通过传统的 jQuery 路由，我将简单地获取元素并添加 HTML。我无法理解如何用 Angular 做完全相同的事情，因为 Angular 控制器中不建议进行 DOM 操作。那么我如何访问我应该扩展的元素。

另一个例子可能是我必须在某个时候重置表单元素。我再次面临在 Angular 控制器中使用 jQuery 样式元素选择器的困境。

有人可以向我解释一下如何用 Angular 做所有这些事情。

4

3 回答 3

5

让我先回答你的标题问题：不要。

AngularJS 是一个强大的工具（我只是触及了它的表面，现在已经专门在 Angular 上工作了 2 个月 @ 工作），但它过于固执己见，无法成为脚本编写的好选择。它有一点学习曲线（不是太陡峭，但肯定比“嘿，{{model}} 是魔法！”介绍你在他们的页面上找到。不要误会我 - 我非常喜欢它，它非常结构化，这迫使我有条理，并使代码具有极强的可扩展性。所以，如果你愿意学习它的“MO”，你就会爱上它。

现在，关于 DOM 操作：您可以通过多种方式进行操作，但基本上，如果您想要 DOM 操作，您需要一个指令。教程可以很好地帮助您，但是如果您对 JS 有一定的了解，我建议您探索源代码（您可能已经知道，ngRepeat 是一个直接的常规指令，就像您可以创建的指令一样） . 角度范围与 DOM 元素相关联，反之亦然。在指令中，您可以处理它所绑定的元素，并使用 jQuery（或任何其他框架，或只是普通的 JS）来更改它。更改可以与元素出现的时刻、模型的更改（通过 $watch 函数）或您自己指定（并触发）的事件相关联（参见 $broadcast ad $emit）。

我更改了一个示例脚本来解决不同类型的问题（即在 ngRepeat 结束时触发事件）以包含一些不同的处理 DOM 的方式：http: //plnkr.co/edit/or5mys

于 2012-11-23T21:33:47.343 回答
0

在 Angular 中，所有 DOM 操作代码都驻留在指令中。因此，如果您需要将 HTML 添加到已经存在的元素，例如从远程 url 加载模式对话框的内容，您将需要为此编写指令。请参阅此处的文档：AngularJS 中的指令

于 2012-11-23T21:21:20.457 回答
0

这取决于您想要执行哪种类型的 DOM 操作；正如其他人所说，指令可以工作，但这更适用于复杂的 DOM 内容或可重复的小部件。对于常规表单，如果只是在某处填写文本，则可以使用控制器的范围来完成。

例如，如果您想更新状态消息，而不是直接更新 DOM，您可以将其绑定到范围内的字段：

<div>{{statusMsg}}</div>

并在您的控制器中，在适当的时候：

scope.statusMsg = 'Done loading';

由于 Angular 有双向数据绑定，DOM 会自动更新消息。

对于表单重置的示例，您的表单将绑定到模型，因此要重置表单，您只需重置模型。这是一个非常简单的例子：http: //jsfiddle.net/Kbsqx/

于 2012-11-24T03:08:57.593 回答