访问属性的 object

Question

我是 Angular 的 Ionic 新手，我有动态 object，我想访问 HTML img src

上的值

TS:

options = [
    {
      id: '0',
      icon: 'assets/icons/set-comparison.svg',
      text: 'Set Comparison'
    },
   ....
  ];

HTML:

<li *ngFor="let item of options" class="sidebar__content"   [ngClass]="{ 'active' : item === selectedMenuItem }">
          <button class="btn" (click)="selectedMenuItem = item">
            <img src="item.icon" class="sidebar__content custom__icon" alt="">
          </button>
        </li>

但是当我调试它时，我得到的是字符串路由：

如何才能正确访问 object 的属性？问候

Answer 1

关于使用一些像(click)="item.action"

“事件”通常在路上(click)="myfunction()"。如果你真的在 item.action 中有一个函数，你应该写

 (click)="item.action()"

但是为此，您确实需要您的项目的属性“操作”是一个函数。

如果“item”是class

的数组

export class MyClass{
  prop1
  prop2
  action(){
    console.log(this.prop1+this.prop2)
  }
}

你应该有一些喜欢

   //imagine this.service.getData return some like
   //[{prop1:"prop1",prop2:"prop2"},{prop1:"hello",prop2:"word"}]

   this.service.getData().subscribe((res:any[]=>{
      this.items=res.map(x=>{
         const obj=new MyClass()
         Object.assign(obj,x)
         return obj
      })
   })

   //or
   this.service.getData().pipe(map((res:any[])=>
      res.map(x=>{
         const obj=new MyClass()
         Object.assign(obj,x)
         return obj
      })).subscribe(res=>this.items=res)

但想象一下你真的收到了一个对象数组

 [{prop1:"prop1",prop2:"prop2",action:"action1"},
  {prop1:"hello",prop2:"word",action:action2}]

最好的办法是写一些像

 (click)="MyFunction(item.action)"

在你的 .ts 中你有

myFunction(action:string)
{
    switch (action)
    {
       case "action1":
           this.action1() //<--here call to a function action1 defined in .ts
           break;
       case "action2":
           this.action2() //<--idem a function action2 defined in .ts
           break;
}

不过你也可以点赞

   this.service.getData().pipe(map((res:any[])=>
      res.map(x=>({...x,action:this[x.action]})
      })).subscribe(res=>this.items=res)

看到，在这种情况下，第一个元素的属性“action”是我们在 .ts

中定义的函数 this[“action1”]

访问属性的 object

Access property of an object

angular

ionic4

访问 属性 的 object

Access property of an object

angular

ionic4

访问属性的 object