Question

我的要求是从父指令调用子指令函数。目前我们已经实现了发布 - 订阅模式。 Child指令订阅某个事件，我们在父指令上触发。发布订阅是通过$ .callbacks

实现的

这可以做的其他方法是使用广播。或者子指令对某个变量有监视，我们可以在父变量上更改此变量。

我们没有使用广播，因为父指令包含很多子事件，我们不想让它全部通过。

我们可以采用另一种方式实现这一点，即使用双向函数绑定

directives.directive('twoWayBind', function () {
    return {
        restrict: "E",
        transclude: true,
        templateUrl: 'app/twoWayBindFunction.html',
        scope: {
            twoWayBinding: '='
        },
        controller: 'twoWayBindFunctionController',
        bindAsController: true,
        controllerAs: 'vm',
        link: function (scope, element, attrs, controller) {
        }
    };
});


controllers.controller('twoWayBindFunctionController', ['$scope', function (scope) {
    var vm = this;
    vm.scope = scope;

    scope.twoWayBinding = function () {
        console.log('twoway bind');
    }    
}]);

我们可以从父作用域调用twoWayBinding函数。

我想了解什么是最佳做法。

Answer 1

我发现对我来说最好的方法是将父对象中的对象传递给子对象。将子指令中的函数添加到该对象，并从父对象中调用它。

app.directive('parent', function() {
    return {
        restrict: 'E',
        scope: {
            buttonCaption: '@'
        },
        bindToController : true,
        controllerAs : 'vm',
        template: "<button ng-click='vm.twoWayObject.childFunc()'>{{vm.buttonCaption}}</button><child two-way-obj='vm.twoWayObject'></child>",
        controller: function($scope) {  
            var vm = this;      
            vm.twoWayObject = {};
        },

        link: function() {             
        }   
    }
});

app.directive('child', function() {
    return {
        restrict: 'E',
        scope: {
            twoWayObj: '='
        },
        bindToController : true,
        controllerAs : 'vm',
        template: "<h1>Chuchi</h1>",             
        link: function() {             
        },
        controller: function($scope){
            var vm = this;
            vm.twoWayObj.childFunc = function(){
                alert('child function called');
            }
        }
    }
});

使用示例添加Fiddle。

看看这个问题（第一个答案）：

How to call a method defined in an AngularJS directive?

角度双向函数绑定最佳实践

1 个答案: