Question

我在stackoverflow上发现了一些类似的问题，但没有令人满意的答案。

我更倾向于使用bindToController和controllerAs在控制器中保存大部分指令逻辑。

因此标准通信beetwen 2指令看起来像：

<parent-directive>
    <child-directive></child-directive>
</parent-directive>

angular.module('app').
    directive('parent', function() {
        return {
            scope: {},
            restrict: 'E',
            controller: function() {
                this.doSomething = function() {
                    console.log('Consider it done!');
                };
            },
            controllerAs: 'vm'
        }
    }).
    directive('child', function() {
       return {
           restrict: 'E',
           require: '^parent',
           link: function($scope, $element, $attrs, parentController) {
               parentController.doSomething();
           }
       }
    });

这种模式当然按预期工作。但是当我想让children指令也使用控制器而不是链接功能时，我可以这样做：

.directive('child', function() {
   return {
       restrict: 'E',
       require: ['child', '^parent'],
       controllerAs: 'vm',
       controller: function() {
           this._parentController = null;
           var vm = this;
           this.doSomethingInChild = function() {
               var iDepnedOnThis = this._parentController.doSomething();
               //do something more with above call result...
           }.bind(this);
       }
       link: function($scope, $element, $attrs, controllers) {
           var vm = controllers[0];
           vm._parentController = controllers[1];
       }
   }    
});

它也有效，但我不确定这是否干净且是最佳解决方案。有没有办法摆脱parentController到childController赋值链接函数？

Answer 1

简单......看看例子：

angular.module('app').
    directive('parent', function() {
        return {
            scope: {},
            restrict: 'E',
            controller: function() {
               this.doSomething = function(){}
               $scope.scope = this;
            }
        }
    })


<parent-directive>
    <child-directive ng-parent="scope"></child-directive>
</parent-directive>

你需要从child-driective访问属性ng-parent。

在另一个指令的控制器中使用指令控制器

1 个答案: