javascript - 我应该如何实现 Angular 选择指令？

Question

我正在尝试使用 angular 指令实现我自己的 select 元素，并面临一个困境，即在指令构建传递给 select 指令的对象时，该指令将为 select 构建标记。

由于在 Angular 文档中描述了 Controller ，它说 Controller 应该与其中的 UI 代码无关，所以它让我在 html 模板中编写对象:

<div ng-controller="ctrl">
    <my-select items="[{name:'name1', value:'value1'},...,{name:'name(n)', value:'value(n)}]></my-select>
</div>

但是看看结果，不知何故感觉把它写在 controller.js 文件里要好得多:

function ctrl($scope){
    $scope.selectItems=[{name:'name1', value:'value1'},...,{name:'name(n)', value:'value(n)}];
}

并在标记中编写如下内容:

<my-select items="selectItems"...></my-select>

什么是“Angular Way”而不是去做呢？

谢谢，

艾兰

Answer 1

也许在 View (模板)中？

大多数选择选项是模型的一部分而不是 View 的一部分，因此它们应该通过 Controller 传递。唯一的异常(exception)是 ui 特定数据，它不是动态的，出于实际原因可以硬编码到模板中。

但即便如此，模板也不应该被大量的数据对象弄得乱七八糟，这是不值得的。

也许在指令中？

指令应该作为可重用和可测试的组件来实现，因此将特定于应用程序的数据放入其中是一个很大的错误。

快速制作原型(prototype)？

对于快速原型(prototype)制作和非常小的对象，您可能可以各走各路。

结论

如果您有 1000 个选项，您还会考虑将它们硬编码到您的 View 或指令中吗？

使用 Controller 。无论如何，您的大部分真实应用程序数据可能都应该保存在真实服务器上。