angularjs - 在 Angular 中为小部件使用指令？

Question

是否应该在 AngularJS 中使用指令来实现小部件或控制器/服务？在谈论小部件时，我想到的是一个 UI 控件，您可以通过控制器与之交互，例如对话框、树、网格、图表。

例如，如果我要创建一个对话框小部件，我想在小部件上调用一个 show() 函数来显示对话框。使用指令似乎不可能。我已经看到在指令监视的根范围内使用了一个变量，例如“showDialog”以解决此问题。在angular-ui中，他们使用服务来实现对话。

score 2 · Accepted Answer

是的，一个指令可以做到这一点，你可以使用两种方式绑定来传递你想要用来确定 HTML 是否可见的表达式。

调整你的想法：考虑 MVC，而不是“你将与控制器交互的 UI 控件”，而是引入一个“模型”。控制器可以通过在范围上设置值来更改模型，视图处理要为给定模型显示的 HTML。控制器不应通过直接操作 DOM 来与 HTML 交互。

在标记中，您可能有：

          <modal-dialog show="showPopup">

其中 showPopup 是当前范围变量（或表达式）。

在您的指令中，您将创建一个隔离范围并使用 '=' 作为 'show' 参数。

在您的指令的 HTML 模板中，您将使用“显示”值来显示对话框。

当然，在这种情况下，有一种更简单的方法……ng-show已经为您完成了此操作，因此您可以将该指令与您自己的包含您要显示的模板的模态对话框指令混合使用。

          <modal-dialog ng-show="showPopup">

score 1 · Accepted Answer

大多数情况下，指令用作 HTML 视图的模板。

Directive 可防止代码重复并使您的 HTML 更加清晰和易于维护。

据我所知，您必须创建像“指针”这样的标签或类来将指令与 DOM 绑定。

根据使用模板的对话框实现，您可以仅使用服务和单独的控制器。

您不能在指令中实现 Dialog。

2 回答 2