Show event value of Page 2 in an input on Page 1

0

I have two pages and I want the value of an event (script below) from Page 2 to be displayed in an input on Page 1.

Page 1 HTML:

<ion-list>
    <ion-item text-center>
      <ion-input type="text" [(ngModel)]="forca"></ion-input>
      <ion-label stacked>Força</ion-label>
    </ion-item>
  </ion-list>

HTML Page 2:

<ion-list>
    <ion-item-sliding #item>
      <ion-item (click)="showConfirm()">
        <ion-avatar item-left>
          <img src="assets/img/adagas.png">
        </ion-avatar>
        <h2>Adagas Sangrentas</h2>
        <h3>Força +1, Agilidade +1</h3>
        <p>Adagas preparadas para derramar sangue, feitas com lâminas forjadas em aço raro e fino.</p>
      </ion-item>

      <ion-item-options side="left">
        <button
          [style.backgroundColor]= "ativo ? 'green' : 'red'"
          (click)="usar()"
        >Usar</button>
      </ion-item-options>
    </ion-item-sliding>
  </ion-list>

Page 2 script:

usar() {
    this.ativo = !this.ativo;
    this.forca = 1;
    console.log(this.forca);
    }

In this case, by clicking on "Use" the value of the "force" input change to 1.

    
asked by anonymous 22.06.2017 / 02:31

1 answer

0

One of the ways you can do this is by using Events

  

link

In the construct of your page 1 you start the listener of the event.

events.subscribe('usar:forca', (valor) => {
    this.forca = valor
});

When the 'event: forca' is called this function will be executed by passing the value to its forca variable.

In its function to use () of page 2 just call the event passing the value of force.

usar() {
   this.ativo = !this.ativo;
   this.forca = 1;
   console.log(this.forca);
   events.publish('usar:forca', this.forca);
}

I do not know how the rest of your code is. If page 2 needs to be closed just close after triggering the event.

    
30.06.2017 / 15:32