我正试图在我的案例中找到一种在组件之间进行通信的方法。
我有一个像这样的角度4组件:
MY-test.component.ts
datalist = [[(u'2017-06-28', 12), (u'2017-06-29', 0), (u'2017-06-30', 17), (u'2017-06-26', 17), (u'2017-06-27', 8), (u'2017-07-02', 0), (u'2017-07-01', 2)], [(u'2017-06-28', 6), (u'2017-06-29', 3), (u'2017-06-30', 13), (u'2017-06-26', 12), (u'2017-06-27', 9), (u'2017-07-02', 1), (u'2017-07-01', 2)]]
MY-child.component.ts
@Component({
selector: 'my-test',
template: `<div>
<my-child></my-child>
</div>`
})
export class MyTestComponent{
}
我有多个@Component({
selector: 'my-child',
template: `
<div *ngIf="show" (click)="toggleMe()">Show this</div>`
})
export class MyChildComponent {
toggleMe() {
this.show = !this.show;
}
}
组件,每个my-test
组件都包含一个my-child组件。
我的问题是如何确保一次只显示一个my-test
组件。现在,如果我点击不同的my-child
组件,它们会一直弹出,但我只希望一次显示一个my-child
组件。有快速的方法吗?非常感谢!