Question

我正在尝试为angular-ui select创建一个包装器组件/指令。

在我的应用程序中，我有几个声明一遍又一遍地相同。因此，尝试重用一些我想要创建单个指令的代码＆＃34; my-select＆＃34;这简单地创建了一个预先配置好的＆＃34;角-UI-选择。

这是我的模板：

<ui-select ng-model="$ctrl.ngModel" class="my-select" >
<ui-select-match placeholder="{{::$ctrl.placeholder}}">{{$select.selected.label}}</ui-select-match>
<ui-select-choices repeat="item in $ctrl.items | filter: $select.search">
    <div ng-bind="item.label"></div>
</ui-select-choices>

组件定义：

    export var SelectComponent = {
    controller: SelectComponentController,
    templateUrl: 'common/select/Select.tpl.html',
    bindings: {
        items: '=',
        ngModel: '=',
        placeholder: '='
    },
    require: {
        ngModelCtrl: 'ngModel'
    }
};

上面的代码几乎就是我提出的，它的工作原理（有点）。

问题是数据绑定过度使用，并且使用包装器会严重影响性能。此外，对项目的双重绑定似乎也会影响原始组件的行为（doens总是按预期工作）。

是否有其他方法可以实现相同的目标（最好使用角度）？

我使用的是Angular 1.5和最新版本的angular-ui-select。

创建角度包装器组件

0 个答案: