Question

我想在指令上定义控制器和require。像这样：

return {
    controller: 'ValidateElementCtrl as validate',
    require: 'ngModel',
    scope: {
        ngModel: '='
    },
    link: link
};

现在，当在链接函数中定义控制器或需要ng模型时，您只能访问第四个参数。我知道第四个参数可以是一个对象并包含多个控制器等，但是当你将控制器定义为一个数组时就是这样。

这就是我所拥有的，我不知道如何访问控制器，我得到了所需的ngModel作为第四个参数：

function link(scope, element, attrs, ctrlGetsNgModel) {
    console.log(ctrlGetsNgModel) // Returns the ngModel, no sign on the controller
}

我知道我可以在指令上定义一个控制器，并将其作为范围属性传递，但在这种情况下，我想为指令定义一个控制器，它将处理验证和类似，并且该控制器将是仅分配给该指令。

修改找到了如何做到这一点的方法：要在链接功能中同时使用ngModel和controller，您可以将控制器分配给模板，如下所示：

然后定义对someDirectiveName的范围访问：＆＃39; =＆＃39;，您可以访问指令范围`scope.someDirectiveName＆＃39;上的控制器。 =＆LT;控制器范围。

Answer 1

不完全确定你想要实现的目标，但我认为你不能把控制器作为＆＃39;在类似于指令定义中的字符串中。使用controllerAs属性，例如：

return {
    // ...
    controller: controller,
    controllerAs: 'validate'
    // ....
};

如果要访问隔离范围上定义的任何属性，也将使用bindToController: true。但我不确定你是否需要隔离范围......

你能澄清一下你的实际目标是什么吗？这是你的目标???

DEMO

<强> HTML

<body ng-controller="MainCtrl">
    <foo ng-model="someModel"></foo>
</body>

<强> JS

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  // the element on which you apply the directive will need to have a model
  // defined if you use `require: 'ngModel'`
  $scope.someModel = {modelValue: 'blah'};
});


app.directive('foo', function(){
  return {
    controller: controller,
    controllerAs: 'validate',
    template: '<div>{{validate.someProp}}</div>',
    require: 'ngModel',

    link: link

  };

  function controller(){ 
    this.someProp = 'bar';
  }

  function link(scope, element, attrs, ctrlGetsNgModel) {
      console.log('ctrlGetsNgModel',ctrlGetsNgModel) // Returns the ngModel, no sign on the controller
  }

});

Answer 2

假设您的指令的名称是＆＃34; validateField＆＃34;，那么您可以传递这样的数组：

return {
    controller: controller,
    controllerAs: 'validate',
    require: ['ngModel', 'validateField'],
    scope: {
        ngModel: '='
    },
    link: link
};

然后在link函数中，第四个参数将是一个包含ngModel控制器和指令控制器的数组。

function link(scope, element, attrs, ctrlArray) {
    console.log(ctrlArray[0]) // Returns the ngModel controller
    console.log(ctrlArray[1]) // Returns your controller
}

如何访问两者都需要：＆＃39; ngModel＆＃39;和指令上的控制器属性

2 个答案: