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

Question

Мой вопрос в логике того, как обмениваться информацией между этими двумя страницами. Возможно ли это?

Контрольный список работает, но я понятия не имею, как добавить значок успеха / ошибки на страницу verifyplace.html рядом с именем комнаты после возврата успеха в функции goToNextPage (). Как сделать это изменение между различными страницами?

Ниже приведены страницы (.html и .ts):

verifyplace.html:

<ion-list>
      <button ion-item (click)="openRoom()">Room</button>
</ion-list>

my verifyplace.ts:

openSala(){
    this.navCtrl.push(VerifyroomPage);
}

my verifyroom.html:

<ion-list>
    <ion-item *ngFor="let item of checkRoom">
      <ion-label>{{ item.title }}</ion-label>
      <ion-checkbox [(ngModel)]="item.checked" color="secondary"></ion-checkbox>
    </ion-item>

    <button ion-button color="secondary" (click)="goToNextPage()" full>Finish</button>
</ion-list>

my verifyroom.ts:

public checkRoom = [
        {
            title: 'Checklist 1',
            checked: false
        },
        {
            title: 'Checklist 2',
            checked: false
        },
        {
            title: 'Checklist 3',
            checked: false
        }   
    ];

    goToNextPage() {
        if (this.checkSala.filter(c=>c.checked == false).length == 0) {
            this.navCtrl.push(VerifyplacePage);
            /*return on the previous page a success icon*/
        } else {
            this.navCtrl.push(VerifyplacePage);
            /*return on the previous page an error icon*/
        }
    }

Answer 1

это мое понимание;

Вы находитесь на странице VerifyroomPage и хотите перейти на другую страницу ( VerifyplacePage ), передавая некоторые параметры.

Вы можете достичь этого, передав объект в качестве второго параметра метода push на Ionic Nav Controller.

/*return on the previous page a success icon*/
this.navCtrl.push(VerifyplacePage, {'data': 'success'});

OR

/*return on the previous page an error icon*/
this.navCtrl.push(VerifyplacePage, {'data': 'error'});

Шаг 2:

Затем на VerifyplacePage.ts

// create a variable to hold the data
thePageData

...

// in the constructor
public navParams: NavParams,

...


// get the data from the nav params and save it in the local variable
// we defined data as the key in the object on the nav controller
this.thePageData = this.navParams.get('data')

Подробнее о навигации в пределах ionic 3 здесь