Question

（对不起我的英文：）

我在AngularUI ui-select2指令的表单中使用Select2，如下所示：

<input ng-model="city" type="text" ui-select2="setupCitySelect" />

其中setupCitySelect - 具有select2选项的对象。我把他安排在合适的范围内

$scope.setupCitySelect = {
    allowClear: true,
    minimumInputLength: 2

    ...etc, about 50 SLOC
}

一切正常。但是，当我们在页面（或页面的一部分）上有五个select2元素 - CitySelect，UserSelect，ConditionSelect等时，我们得到了大量的代码，其中大部分是相同的。 AngularUI提供“全局默认值”。所以我们可以移动重复代码（在指令中）：

var dirs = angular.module('vipc.directives', ['ui']);

// defaults setting for UI
dirs.value('ui.config', {
    select2: {
        allowClear: true,
        minimumInputLength: 2,
        formatInputTooShort: function(term, minLenght) {
            var rest = minLenght - term.length;
            return "minimum: "+rest;
        },
...etc.

但我们仍然需要在控制器中做一些工作：设置独特的属性，例如ajax-url ...... 它来自几个页面，几个控制器。 Ough ... 是的，我可以把它放到一个文件中，比如common.js。但我想 - 这不是最好的方式。安古拉斯说：“使用指令，卢克！”。但是怎么样？太复杂的文档。我看了docs。三次。没有成功。我写了一些简单的dirs，但这...... 它应该具有“隔离”范围 - 可以是页面上的2个CitySelect - 以上面的搜索表单和模式形式。编译功能？链接功能？

我只需要

<myapp-city-select id="city"></myapp-city-select>
<myapp-user-select></myapp-city-select>
...later, same html file
<myapp-city-select id="city2"></myapp-city-select>

有人可以帮忙吗？

Answer 1

它应该在控制器中。这是plunker。向您显示所有指令共享相同的数据。

因此，您可以在控制器中使用带有公共选项的指令，并将特定选项传递给它。

另一个选择是拥有一个定义常用选项的服务，并将服务注入到您想要的任何位置。

AngularJS select2 - 如何创建指令？

1 个答案: