訪問容器組件的方法

Question

我有一個組件的telerik SideDrawer，所以我可以在answer之後通過 重複使用它。工作正常。

內部login.component.html我需要使用存在於header.component.ts 例如openDrawer（）方法：

login.component.html

<your-header> 
    <StackLayout class="content"> 
     <Button text="Open!" (tap)="openDrawer()"></Button> 
    </StackLayout> 
</your-header> 

header.component。 ts

//~ 
export class HeaderComponent //~ 
{ 
    //~ 
    public openDrawer() { 
     console.log('opened!'); 
     //~ 
    } 
    //~ 
} 

但我得到一個錯誤：self.context.openDrawer不是一個函數。

怎麼辦？

Answer 1

以下this answer不難

login.component.html：

<your-header> 
    <StackLayout class="content"> 
     <Button text="Open!" (tap)="_parent.openDrawer()"></Button> 
    </StackLayout> 
</your-header> 

login.component.ts：

import { Component, ViewChild } from "@angular/core"; 
import { HeaderComponent } from "../header/header.component"; 
@Component({ 
    selector: "login", 
    templateUrl: 'pages/login/login.html' 
}) 
export class LoginComponent { 
    constructor() {} 
    @ViewChild(HeaderComponent) 
    private _parent: HeaderComponent; 
} 

不幸的是我需要添加3線我使用的每個組件都不好玩。我很想看到更好的方法。