이온 2 - 매개 변수가있는 페이지 간 탐색 (빈 응용 프로그램)

Question

필자는 빈 이온 2 프로젝트가 있으며 목록이있는 페이지가 있습니다. 목록 항목을 클릭하면 항목의 상세보기가 표시됩니다. 여기 내 목록의 파일은 다음과 같습니다

list.html :

<ion-navbar *navbar> 
    <ion-title>list</ion-title> 
</ion-navbar> 

<ion-content padding class="list"> 
    <ion-list> 
     <ion-item *ngFor="let item of items" (click)="viewItem(item)">{{item.title}}</ion-item> 
    </ion-list> 
</ion-content> 

list.js :

import {Component} from '@angular/core'; 
import {NavController} from 'ionic-angular'; 
import {ItemDetailPage} from '../item-detail/item-detail'; 

@Component({ 
    templateUrl: 'build/pages/list/list.html', 
}) 
export class ListPage { 
    static get parameters() { 
    return [[NavController]]; 
    } 

    constructor(nav) { 
     this.nav = nav; 

     this.items = [ 
      {title: 'Hi1', description: 'whats up?'}, 
      {title: 'Hi2', description: 'whats up?'}, 
      {title: 'Hi3', description: 'whats up?'} 
     ]; 
    } 

    viewItem(){ 
     this.nav.push(ItemDetailPage, { 
      item: item 
     }); 
    } 
} 

그리고 여기 내 상세보기 파일입니다 :

세부-view.html은 :

<ion-navbar *navbar> 
    <ion-title>{{title}}</ion-title> 
</ion-navbar> 

<ion-content padding class="item-detail"> 
    <ion-card> 
     <ion-card-content> 
      {{description}} 
     </ion-card-content> 

    </ion-card> 
</ion-content> 

detail-view.j S :

import {Component} from '@angular/core'; 
import {NavController, NavParams} from 'ionic-angular'; 

@Component({ 
    templateUrl: 'build/pages/item-detail/item-detail.html', 
}) 
export class ItemDetailPage { 
    static get parameters() { 
    return [[NavController]]; 
    } 

    constructor(navParams: NavParams) { 
     this.navParams = navParams; 

     this.title = this.navParams.get('item').title; 
     this.description = this.navParams.get('item').description; 
    } 
} 

내가 사용

"이온 성 역할"나는 다음과 같은 메시지가 얻을 :

SyntaxError: C:/.../app/pages/item-detail/item-detail.js: Unexpected token (18:23) while parsing file: ...

그래서 나는 상세 뷰의 생성자가이 방식으로 작동 해달라고 생각합니다. 그러나 나는 나를 도와 줄 수있는 것이 어디에도 없다. 나는 내가 찾은 튜토리얼이 2015 년에 나온 것이기 때문에이 솔루션은 더 이상 사용되지 않을 것이라고 생각한다.하지만 내가 말했듯이 나는 그것에 대해 유용한 것을 발견하지 못했다. 내 이온 Framework 버전 2.0.0 - beta.8 여기

Answer 1

입니다 :

(click)="viewItem(item)" 

당신은 매개 변수로 항목을 전송하고 있지만 방법 :

viewItem(){ 
    this.nav.push(ItemDetailPage, { 
     item: item 
    }); 
} 

당신은 받고 있지 않습니다 그것. 나는 당신이 단지 이것과 같은 매개 변수로 그것을 포함해야한다고 생각하고 그것은 잘 작동해야합니다 :

viewItem(item: any) { 
    this.nav.push(ItemDetailPage, { 
     item: item 
    }) 
}