Question

我已经在localstorage中存储了一些数据，我想以html模板内插的方式访问它，但是当我在模板内调用它时会发生错误。

  </code for calling localstorage inside a component.ts file
   ngOninit(){
   this.myResponse = JSON.parse(localStorage.getItem('fav'));
   console.log(this.myResponse)
   return this.myResponse;
   }
   />


  </code inside html template of the component file
   <div class="conatiner">
   <div class="row" *ngFor="let single of myResponse" >
   <p>{{single}}</p>
   </div>
   </div>
   />



     output of html component i am getting
     [Object Object]
     [Object Object]
     [Object Object]
     [Object Object]
     [Object Object]


   console output for component.ts ie console.log(myResponse)
  (6) [{…}, {…}, {…}, {…}, {…}, {…}]0: {ifsc: "ABHY0065001", bank_id: 60, 
   branch: "RTGS-HO", address: "ABHYUDAYA BANK BLDG., B.NO.71, NEHRU 
   NAGAR, KURLA (E), MUMBAI-400024", city: "MUMBAI", …}
    ............}

Answer 1

@vaibhav，您正在此处打印对象，如果要访问该对象的属性，请替换HTML代码，如下所示：

<div class="conatiner">
     <div class="row" *ngFor="let single of myResponse" >
        <p>{{single.ifsc}}</p> 
      </div>

或者，如果您想显示整个对象，则使用json管道

{{single | json}}

如何将本地存储中存在的json数据呈现到html模板

1 个答案: