2016-06-07 4 views
0

Я вызываю службу данных в угловом 2-х компоненте для загрузки данных в функцию ngOnInit(). Этот компонент помещается на страницу вкладки «Ионные». Функция ngOnInit() вызывается только при инициализации, но не при каждой навигации по вкладке. Я хочу перезагрузить данные из службы данных при каждой навигации на страницу, чтобы обновить компонент с последними данными.Как обновить компонент при каждом изменении страницы

Как я могу вызвать функцию в компоненте при каждой навигации на странице вкладок?

Это мой компонент:

@Component({ 
    selector: 'reservation-list', 
    templateUrl: 'build/components/reservation-list.component.html', 
    bindings: [DataService, TimeService] 
}) 
export class ReservationListComponent { 
    public items: any = []; 

    constructor(private dataService: DataService) { } 

    public ngOnInit() { 
    // this I want to call on each tab navigation! 
    this.items = this.dataService.getEvents(); 
    } 
} 

Мои закладки в основном пример ionic2-вкладка:

@Page({ 
    templateUrl: 'build/pages/tabs/tabs.html' 
}) 
export class TabsPage { 
    // this tells the tabs component which Pages 
    // should be each tab's root Page 
    tab1Root: any = Page1; 
    tab2Root: any = Page2; 
    tab3Root: any = Page3; 
} 

И страница является основной ионной страницей, где компонент вставка:

<reservation-list></reservation-list> 

@Page({ 
    templateUrl: 'build/pages/page1/page1.html', 
    directives: [ReservationListComponent] 
}) 
export class Page1 { 

    constructor() { 
    } 
} 

ответ

1

Я думаю, вы можете добавить обработчик события щелчка, когда вы нажимаете на свои вкладки и вызываете эту функцию.

В теге

<a (click)="getEvents()"></a> 

В вас Компонента

getEvents() { 
    this.items = this.dataService.getEvents(); 
} 
+0

Где я должен поместить GetEvents тогда? на странице? Страница ничего не знает о компоненте. –

+0

Вы должны разместить в обоих. В вашем шаблоне HTML и в вашем компоненте. – Guido

+0

Если я это сделаю, мне нужно отметить элементы как входной параметр? '<список-резервирование [items] =" items ">'? –

Смежные вопросы