Question

我最近在 Angular 开始，所以我有一些问题。

我的问题：
我创建了一个指令，我将在许多页面中使用＆＃39;例如，在每种情况下使用不同的控制器。
现在我可以动态设置控制器，这个问题就解决了！
但是，在每个指令实例中，我想定义要更改的变量是什么在控制器中，如ng-model。如果我直接在模板中放入标签，它可以工作，但我需要它动态。

指令：

app.directive('mySelectPicker', function () {
var ddo = {};
    ddo.restrict = 'E';
    ddo.templateUrl = 'js/directives/views/my-select-picker.html';

    ddo.scope = {};
    ddo.controller = "@";
    ddo.name = "controllerName";

    return ddo;
});

MY-SELECT-PICKER.HTML ：
OBS1 :( ng-repeat与时间控制器＆＃39;数组中的值完美配合） OBS2 ：如果我将ng-model放在select标签中，它会起作用，但会是静态的！

<select>
    <option value="{{time.value}}" ng-repeat="time in times" >{{time.text}}</option>
</select>

CONTROLLER ：

app.controller('MyController', function($scope, moment){
    $scope.times = []; //array with the options
    $scope.val1 = '';
    $scope.val2 = '';
});

使用指令：

<my-select-picker controller-name="MyController" **ng-model="val1"**></my-select-picker>
<my-select-picker controller-name="MyController" **ng-model="val2"**></my-select-picker>

在简历中，我需要在每个ng-model中定义<my-select-picker>来定义控制器中的变量。怎么可能？

Answer 1

您已为指令创建了隔离范围，因此您无法访问已放置指令标记的控制器指令的父范围，因此您需要传递选项列表＆amp;您的指令的型号名称。

不要使用ng-model作为属性，因为对于指令元素的ues ng-model属性没有任何意义，因为它不是输入元素。相反，您可以将该属性命名为model＆amp; list然后定义model＆amp;您的孤立指令中的list属性。这两个属性都将使用=，以便它可以轻松执行双向绑定。此外，您可以使用ng-options代替ng-repeat选项呈现，因为ng-options能够在选择时将对象绑定到ng-model。

<强> HTML

<my-select-picker list="times" controller-name="MyController" model="val1"></my-select-picker>
<my-select-picker list="times" controller-name="MyController" model="val2"></my-select-picker>

<强>指令

ddo.scope = {
   model: '=',
   list: '='
};

我选-picker.html

<select ng-model="model" ng-options="l.value as l.text for l in list"></select>

AngularJS如何在自定义指令标签内使用ng-model，动态设置控制器？

1 个答案: