CODEWITHSUNDEEP
htmlangularionic-framework
Ramki
Ramki

Reputation: 381

unable to bind values from observable json object in ionic

Am trying to bind the property of JSON response from api response stored as observable to the ionic title. But couldn't make it work. Can someone help me with whats wrong in it.

page.ts

export class DisplayPage implements OnInit {
  Category : any;
  result: Observable<any>;
  constructor(private route: ActivatedRoute, private router: Router, private myService: MyService) {
    this.Category = this.route.snapshot.params.Category;
    var id = this.route.snapshot.params.id;
    this.result = this.myService.result(this.Category,id);
    this.result.subscribe(res => console.log(res.name));//can see the response here logged
  }

page.html

<ion-header>
  <ion-toolbar>
    <ion-title>{{result.name | async}}</ion-title> *** not working ***
  </ion-toolbar>
</ion-header>

<ion-content>

</ion-content>

I also tried ng-bind, but could not make it work. The API call is fine. the response is there as in the code am able to console log it. but not binding to the page.

Upvotes: 0

Views: 75

Answers (1)

Ashish Ranjan
Ashish Ranjan

Reputation: 12960

result is an observable, result.name is not, maybe you can achieve it the following way:

<ng-container *ngIf="result | async as res">
    <ion-title>{{res.name}}</ion-title>
</ng-container>

Upvotes: 2

Related Questions