Ionic2：由組件

Question

獲得在一個頁面輸入文本字段這是我的搜索page，我加載搜索結果與對週期

<ion-header> 
    <ion-navbar> 
     <ion-title>Search</ion-title> 
    </ion-navbar> 
</ion-header> 
<ion-content padding> 
<ion-list> 
    <ion-item> 
     <ion-input [(ngModel)]="room_name" type="text"></ion-input> 
    </ion-item> 
    <ion-list> 
     <guide-view *ngFor="let g of guideList" [guide]="g"></guide-view> 
    </ion-list> 
</ion-list> 
</ion-content> 

我的目標是使現有的[(ngModel)]="room_name"爲guideView組件：

@Component({ 
    selector: 'guide-view', 
    template: ` 
<ion-item> 
    <ion-thumbnail item-left> 
     <img src="{{guide.imagePreviewUrl}}"> 
    </ion-thumbnail> 
    <h2>{{guide.username}} {{message}}</h2> 
    <p>rate: {{guide.rate}}</p> 
    <button clear ion-button outline item-right icon-left (click)="engageGuide(guide.username)"> 
     <ion-icon name="arrow-dropright"></ion-icon> 
     Open Room 
    </button> 
</ion-item>` 
}) 
export class GuideView { 
    @Input() 
    guide: Guide; 
    message : any; 

    constructor(public navCtrl: NavController, public myService: MyServiceh) {}  

    engageGuide(guide: Guide): void{ 
     this.myService.openRoom(???room_name???,guide).subscribe((data)=>{ 
     .... 
    } 
} 

正如你所看到的，我需要輸入文本的值，請致電openRoom，但我不知道如何接受它。

Answer 1

在搜索頁面此行

<guide-view *ngFor="let g of guideList" [guide]="g"></guide-view>

成爲

<guide-view *ngFor="let g of guideList" [guide]="g" [room_name]="room_name"></guide-view>

然後我可以採取的成分，它的room_name用下面的代碼：

export class GuideView { 
    @Input() 
    guide: Guide; 
    message : any; 
    @Input('room_name') = myRoom; 

    constructor(public navCtrl: NavController, public myService: MyServiceh) {}  

    engageGuide(guide: Guide): void{ 
     this.myService.openRoom(this.myRoom,guide).subscribe((data)=>{ 
     .... 
    } 
}