Refresh Elternteil Inhalt außerhalb des Kindes View

Question

Gibt es einen einfachen Weg, wo ich die Eltern-Ansicht sagen kann, um den Inhalt zu aktualisieren?

In diesem Fall bin ich die Änderung der Art Modell und möchte meine HTTP-Anfrage mit diesem neuen Modell Status abzufragen.

import {Component} from '@angular/core'; 
import {LoadingController,NavController,PopoverController,ViewController} from 'ionic-angular'; 
import {Http} from '@angular/http'; 
import 'rxjs/add/operator/map'; 
@Component({ 
template: ` 
<ion-list radio-group [(ngModel)]="suchService.sort" class="popover-page"> 
    <ion-item> 
    <ion-label>Entfernung aufsteigend</ion-label> 
    <ion-radio (click)="sortchange()"value=""></ion-radio> 
    </ion-item> 
    <ion-item> 
    <ion-label>Neueste zuerst</ion-label> 
    <ion-radio (click)="sortchange()"value="9"></ion-radio> 
    </ion-item> 
    <ion-item> 
    <ion-label>Preis aufsteigend</ion-label> 
    <ion-radio (click)="sortchange()"value="1"></ion-radio> 
    </ion-item> 
</ion-list> 
` 
}) 
class PopoverPage { 

constructor(private suchService: SuchService, private viewController: ViewController) { 

} 
sortchange(){ 
    console.log("HALLO?"); <-- CALL FUNCTION OF ERGEBNISSE 
    this.viewController.dismiss(); 
} 
} 
export class Ergebnisse { 
..... 
getResults(){...} 
.... 
} 

Ich kann nicht die ergebnisse Klasse in mein Popoverpage importieren ... Auch wenn ich noch .ts für die Popoverpage Datei verwenden ...

Answer 1

Hey danke allen für deine Antwort.

Put Ich habe einige ionische spezifische API verwendet, um es zu lösen.

ich das Kind Popover über

war die Schaffung

presentPopover(ev) { 

let popover = this.popoverCtrl.create(PopoverPage, {}); 

popover.present({ 
    ev: ev 
}); 

Dann einige Zuhörer von Ionic ist das mein Problem löst.

popover.onDidDismiss(data => { 
//Can Use Data which is passed by Popover 
}); 

Answer 2

Here is a great read about component interaction

Verwenden @Output in Ihrem Kind und hören Sie danach im übergeordneten Element

untergeordnete Komponente .ts - deklarieren Sie eine Ausgabevariable, die ein Ereignis ausgeben wird, wenn es in Ihrer Funktion aufgerufen wird.

@Output() sortChangedEvent = new EventEmitter<any>(); 

sortChange() { 
    this.sortChangedEvent.emit({sortOrder: 'asc'}); 
} 

Geordnete Komponente html - verbindet das Kind Ereignis-Emitter mit einer Funktion in der Stammkomponente

<child-component (sortChange)="refereshListOrder($event)"></child-component> 

Geordnete Komponente .ts - Erstellen Sie eine Funktion, die für das Ereignis hört

refreshListOrder(event) { 
    // sudo code below 
    service.getData().withSortOrder(event.sortOrder); 
}