Question

我正在尝试创建一个指令：

     return {
            restrict: 'A', // Attribute Directive
            ngModel: '^ngModel',
            scope: {
                'ngModel': '='
            },
            link: function ($scope: ng.IScope, element, attrs, ctrl) {

                var datePickerOptions = {
                    autoclose: true,
                    format: attrs.aceDatepickerFormat,
                    weekStart: attrs.aceDatepickerWeekstart
                };

                // Attach the datepicker events (must have Bootstrap.DatePicker referenced).
                element.datepicker(datePickerOptions).next().on('click', function () {
                    $(this).prev().focus();
                });

                element.click(() => {
                    ctrl.$setViewValue(new Date());
                });
            }
        };

在这个例子中，当元素上发生click事件时，我希望使用ctrl。$ setViewValue到当前日期（这是一个测试）。

调用link函数时，scope，element和atts都正确填充，但是ctrl为null。

该元素带有一个带有ng-controller设置的div。

<div ng-controller="Controllers.FormElementsController">
    <input class="form-control date-picker" id="id-date-picker-1" type="text"
           ng-model="DatePickerValue"
           ace-datepicker-weekstart="1"
           ace-datepicker-format="dd-mm-yyyy"
           ace-datepicker="" />

</div>

为什么没有控制器在这里传递？

Answer 1

您必须使用require拉入控制器（在您的情况下为ngModelController）：

return {
            restrict: 'A', // Attribute Directive
            require: '^ngModel',

您已将其设置为ngModel作为属性名称。

来自the docs：

myPane指令有一个值为^ myTabs的require选项。当一个指令使用此选项，$ compile将抛出错误，除非找到指定的控制器。 ^前缀表示该指令在其父节点上搜索控制器（没有^前缀，指令只在它自己的元素上寻找控制器。）

AngularJS：链接函数未被传递给Controller

1 个答案: