Angular Ionic 3选项卡在初始化后不会刷新

每个选项卡使用不同的navParams调用相同的组件“EventDetailItemsComponent”。异步数据（可观察）从this.itemService检索并按预期显示

当我第二次切换回同一选项卡时，问题开始出现。由于不再调用该组件，它将显示相同的异步数据。因此选项卡视图不会更新

我想要的是在每次单击选项卡时调用EventDetailItemsComponent。不仅仅是第一次点击

将异步数据从父组件EventDetailComponent传递到子组件EventDetailItemsComponent（ionSelect）=“myMethod（）”是否正确

选项卡内容EventDetailItemsComponent-事件订阅

    constructor(
            public itemService: ItemService,       
            public events: Events) {
            events.subscribe('tab:clicked', (itemTypeId, eventId) => {
                this.itemService.getItemList(eventId, itemTypeId).subscribe(x => {
                    this._itemDetail.next(x);
                });
            });
        }

---

似乎您需要知道如何在

父级

到

子级

之间传递数据。因此，您可以使用

输入

属性来完成此操作

选项1:

就你而言：

<event-detail-items [itemDetail]="itemDetail"></event-detail-items>

请看地图

child.ts

从'@angular/core'导入{Component，Input}；
从“/Hero”导入{Hero}；
@组成部分({
选择器：'英雄孩子'，
模板：`
{{hero.name}}说：
一、 {{hero.name}，我为您效劳，{{masterName}

`
})
导出类组件{
@输入（）英雄：英雄；
@输入（“主”）主名称：字符串；
}

parent.ts

从'@angular/core'导入{Component}；
从“/hero”导入{heromes}；
@组成部分({
选择器：“英雄家长”，
模板：`
{{master}}控制{{heromes.length}}个英雄
`
})
导出类组件{
英雄=英雄；
master=‘master’；
}

---

选项2:使用

是否也可以显示子组件的

代码

html

和

ts

@Sampath我添加了子组件和它的htmlion-tab或离子网格单击你想更新吗？@rashidnk你建议在函数中单击并使用@Input将异步数据传递给子组件吗？你能显示父组件和子组件之间交互的

code

html

code？当我尝试时，它会抛出这样一个错误：“无法绑定到'itemDetail'，因为它不是'ion tab'的已知属性”，所以ion tab可能不接受输入参数。我现在将尝试使用[rootParams]传递异步数据。但是[rootParams]是我知识的终点，如果它不起作用，我将完全被卡住：）你不能这样做。因为

ion tab

不是你的

子组件

否？您需要像这样将它绑定到您的子组件：

我考虑将ion tab作为我的子组件。在根组件和IONTAB组件之间是否有传递数据的等效方法？不，你错了。你不能这样想。你有另一种方法来在组件之间传递数据。

public eventTabsChanged(itemTypeId) {
            let event = this._eventDetail.getValue();
            this.events.publish('tab:clicked', itemTypeId, event.id);
        }

    constructor(
            public itemService: ItemService,       
            public events: Events) {
            events.subscribe('tab:clicked', (itemTypeId, eventId) => {
                this.itemService.getItemList(eventId, itemTypeId).subscribe(x => {
                    this._itemDetail.next(x);
                });
            });
        }

<event-detail-items [itemDetail]="itemDetail"></event-detail-items>

import { Component, Input } from '@angular/core';

import { Hero } from './hero';

@Component({
  selector: 'hero-child',
  template: `
    <h3>{{hero.name}} says:</h3>
    <p>I, {{hero.name}}, am at your service, {{masterName}}.</p>
  `
})
export class HeroChildComponent {
  @Input() hero: Hero;
  @Input('master') masterName: string;
}

import { Component } from '@angular/core';

import { HEROES } from './hero';

@Component({
  selector: 'hero-parent',
  template: `
    <h2>{{master}} controls {{heroes.length}} heroes</h2>
    <hero-child *ngFor="let hero of heroes"
      [hero]="hero"
      [master]="master">
    </hero-child>
  `
})
export class HeroParentComponent {
  heroes = HEROES;
  master = 'Master';
}