Angular 2 从另一个组件访问组件

Question

我有一个包含两个组件的页面：

Page({
    template: '<ion-navbar *navbar class="contact_navbar">
                    <ion-title>Loan Calculator</ion-title>
                </ion-navbar>
                <ion-content><ck-auto-loan-calculator type="normal"></ck-auto-loan-calculator></ion-content><ck-keypad id="keypad"></ck-keypad>',
    directives: [[ckAutoLoanCalculator], [Keypad]]
})
export class LoanCalculator {}

现在在 ck-auto-loan-calculator 里面我有一个按钮：(click)="showKeypad()"

showKeypad() 函数曾经有 let k = this.app.getComponent('keypad');，这是访问 <ck-keypad> 组件

现在，由于 ionic 更改为 beta 7 并且 angular 更改为 RC，我收到以下错误：原始异常：TypeError：无法读取未定义的属性 'setControl'

如何使键盘组件在 Ck-auto-loan-calculator 组件中可访问？

谢谢

Answer 1

Ionic 2 getComponent 已被弃用，您可以将组件作为输入传递给另一个组件。

您可以使用以下语法从模板传递它：

<ck-auto-loan-calculator type="normal" [keypad]="keypad"></ck-auto-loan-calculator>
<ck-keypad #keypad></ck-keypad>

然后在ckAutoLoanCalculator

  @Input() keypad: Keypad

您 ckAutoLoanCalculator

中的任意位置

  this.keypad.open() // assumes there's a public method on keypad component called open

Plunker for passing components as inputs，用模态组件做了例子来说明

Angular 2 从另一个组件访问组件

Angular 2 access component from another component

ionic-framework

angular

components

ionic2

viewchild