【问题标题】:Angular2 -- @ViewChild from TypeScript base abstract classAngular2——来自 TypeScript 基础抽象类的 @ViewChild
【发布时间】:2016-08-18 22:50:53
【问题描述】:

我在寻找@this SO Q & A,想知道是否有可能有一个基础abstract class 来代替?除了interface,是否可以通过Angular2中的@ViewChild装饰器在子组件中对父组件进行不同的基类实现?

理想情况下,我希望通过父级Router 实例化的子组件能够调用父级路由器——这有意义吗?我希望孩子能够拨打parentRouter.navigate(["SomeOtherRoute", { args: 'blah' }]);

我最初的方法是让子组件实现一个基类,父组件将通过@ViewChild 装饰器获得对它的引用。父级将subscribe 响应子级尝试调用导航事件的操作,其处理程序将调用router.navigate(因为它在父级具有路由器)。

【问题讨论】:

    标签: angular angular-routing viewchild


    【解决方案1】:

    其实很简单。例如,如果您有一个 EmployeeComponent 类,它扩展了作为抽象类的 PersonComponent。

    您可以通过在 EmployeeComponent 中添加它来使其平易近人:

    providers: [ {provide: PersonComponent, useExisting: EmployeeComponent }]

    并像这样在容器组件中使用 ViewChildren() 或 ContentChildren():

    @ViewChildren(PersonComponent) public persons: QueryList<PersonComponent>;

    【讨论】:

    • 这应该是正确的答案,就像一个魅力。
    【解决方案2】:

    您不能使用@ViewChildren() 或任何类似的装饰器来查询组件的子类。

    仅支持模板变量的名称以及具体的组件和指令类型(在您的视图中实际实例化为组件的类型)。

    【讨论】:

    【解决方案3】:

    是的!这是可能的,我发现在某些情况下它可以更干净,尽管对于您的用例,我认为服务是可取的。请参阅我对有关接口的原始问题的回答。我也许应该把它贴在这里。

    https://*.com/a/41151492/4293638

    【讨论】: