angularjs-components - AngularJs 1.5 - 无法通过父组件在两个组件之间进行通信

Question

我按以下顺序有 3 个组件：1 个父组件和 2 个子组件。我需要在父组件中运行一个函数，方法是从两个子组件中的任何一个启动它。

两个子组件js文件如下所示：

angular
    .module('app)
    .component(childComponent1, {
        bindings: {
            switch: '&'
        },
        templateUrl: '...',
        controller: ['$scope', function ($scope) {    
        }]
    });

angular
    .module('app)
    .component(childComponent2, {
        bindings: {
            switch: '&'
        },
        templateUrl: '...',
        controller: ['$scope', function ($scope) {    
        }]
    });

父组件：

angular
    .module('app)
    .component(parentComponent, {
        bindings: {
            switch: '&'
        },
        templateUrl: '...',
        controller: ['$scope', function ($scope) {
           this.switch = function(){
               'some code...'
            }
        }]
    });

在每个子组件模板中都有一个应该运行父函数的按钮switch，如下所示：

<button class="btn" ng-click="$ctrl.switch()">Back</button>

代码不起作用，有什么建议吗？

Answer 1

与其使用绑定，不如尝试在子组件中使用所需的参数来访问父组件控制器。

require: {
   parentCtrl: '^parentComponent'
},

查看https://plnkr.co/edit/fPGuZzIqNbfXeBGXve4J?p=preview以获取此方法的示例。

此外，如果使用 .component 来尝试使您的 Angular 1.5 更容易升级到 Angular 2.0，您还应该尝试避免在组件控制器中使用 $scope。