0

I have a html table like this

<table>
  <tr>
    <td>Ime</td>
    <td>Prezime</td>
    <td>Jmbg</td>
    <td>Izmeni</td>
  </tr>
  <tr *ngFor="let osoba of osobe | async">
    <td>{{osoba.ime}}</td>
    <td>{{osoba.prezime}}</td>
    <td>{{osoba.jmbg}}</td>
    <td>
      <input type="button" value="change 
      (click)="saveSelectedPerson(osoba)">
    </td>
  </tr>
</table>

I need to define the function (click)="saveSelectedPerson" so that on click app goes to another form to change osoba(Person) info of that person, meaning i need to somehow import that particular person into ChangeInfoComponent which is another component this is just the PreviewComponent

I tried creating object in PreviewComponent and assigning the properties from clicked Person , but when i log that (this.goToOsoba) Person is undefined

 saveSelectedPerson(o: Osoba) {
     console.log(o);
     console.log(this.goToOsoba);
      this.goToOsoba.ime = o.ime;
      this.goToOsoba.prezime=o.prezime;
      this.goToOsoba.jmbg=o.jmbg;
   }

What am i doing wrong ? And is my approach good or sharing object between the component is supposed to be done some other way and not over public properties of component ?

1 Answers1

1

Use shared service to store and retrieve information about selected osoba. Save it to service in saveSelectedPerson function, and in ChangeInfoComponent use same service to get that data. More options you have it here: https://angular.io/guide/component-interaction

KrystianC
  • 422
  • 3
  • 13