Javascript 角度2选项卡集-选项卡相互对话

目前在我的项目中，我有一个angular2选项卡集，可以显示其他html模板，如-

Tabs.html

<tabset class="Myclass">
  <tab heading ="Page1" (select)="sendMessageToPage2(Message)"<PageOne id="0"></PageOne></tab>
  <tab heading ="Page2" (select)="sendMessageToPage1(Message)"<PageTwo></PageTwo></tab>
</tabset>

---

我的问题是如何从第1页到第2页获取消息，或者让他们共享一个变量。基本上，我需要第1页对第2页上发生的更改做出反应，或者在切换回第1页时运行一些功能。

您需要从第1页向选项卡组件发出事件，然后从选项卡控制其他组件：

@Component({
  selector: 'PageOne',
  templateUrl: `<div (click)="onClick()">Click Me</div>`
})

export class PageOne {
    // creating EventEmitter to emit when onClick is called
    @Output() changed = new EventEmitter();
    onClick() {
        this.changed.emit();
    }
}

@组件({
选择器：“第一页”，
templateUrl:`单击我`
})
导出类第一页{
//创建EventEmitter以在调用onClick时发射
@输出（）已更改=新的EventEmitter（）；
onClick（）{
this.changed.emit（）；
}
}

或者更好的方法是在这两个组件（PageOne和PageTwo）之间共享服务并通过服务进行通信，简而言之，选项卡模块在选项卡模块.ts|js和PageOne和PageTwo中提供服务，因为选项卡模块的组件可以访问它（angular2中的DI）然后他们通过该服务进行通信，他们可以公开/订阅消息，有关更多信息，请参阅

关于publih/subscribe，您可以参考：

---

您需要从PageOne向选项卡组件发出事件，然后从选项卡控制其他组件：

@Component({
  selector: 'PageOne',
  templateUrl: `<div (click)="onClick()">Click Me</div>`
})

export class PageOne {
    // creating EventEmitter to emit when onClick is called
    @Output() changed = new EventEmitter();
    onClick() {
        this.changed.emit();
    }
}

@组件({
选择器：“第一页”，
templateUrl:`单击我`
})
导出类第一页{
//创建EventEmitter以在调用onClick时发射
@输出（）已更改=新的EventEmitter（）；
onClick（）{
this.changed.emit（）；
}
}

或者更好的方法是在这两个组件（PageOne和PageTwo）之间共享服务并通过服务进行通信，简而言之，选项卡模块在选项卡模块.ts|js和PageOne和PageTwo中提供服务，因为选项卡模块的组件可以访问它（angular2中的DI）然后他们通过该服务进行通信，他们可以公开/订阅消息，有关更多信息，请参阅

关于publih/subscribe，您可以参考：

---

谢谢工作得很有魅力。两人现在都在使用相同的服务并使用它来填充他们的视图。谢谢工作得很有魅力。两人现在都在使用相同的服务并使用它来填充他们的视图。