javascript - AngularJS 组件需要 : componentOne OR componentTwo

Question

我想将模板中的一些函数传递给当前事件的父组件:

<div ng-click="thisComponent.parentComponent.fn()"></div>

父组件取决于您正在查看的页面和配置，所以我尝试了:

app.component('thisComponent', {
    controllerAs: 'thisComponent'
    require: {
        parentComponent : '?^componentOne' || '?^componentTwo'
    },
    controller: function() {
        this.$onInit = () => {
            // Returns null when the parent is componentTwo
            console.log(this.parentComponent);
        }
    }
});

代码不会中断，当 componentOne 是父级时，它实际上可以工作，但是当它不是父级时，this.parentComponent 的计算结果为 null，无需尝试 componentTwo。

<小时/>

更新2018-02-28

它与@Korte的答案一起工作(见下文)，但仍然想知道为什么上面的代码不起作用。当第一个选项返回 null 时，为什么它不评估下一个选项？有谁愿意解释一下吗？

Answer 1

您可能需要两个父组件，然后检查定义了哪一个。

例如

app.component('thisComponent', {
    controllerAs: 'thisComponent',
    require: {
        firstParent : '?^componentOne',
        secondParent: '?^componentTwo'
    },
    controller: function() {
        this.$onInit = () => {
            this.parentComponent = this.firstParent || this.secondParent;
            console.log(this.parentComponent);
        }
    }
});

Here's a working fiddle.