首页 > 解决方案 > textarea 中的对象条件样式数组。角 6

问题描述

我有一个这样的对象数组:

   list =[  
   {  
      name:"name1",
      value:true
   }   {  
      name:"name2",
      value:false
   }   {  
      name:"name3",
      value:true
   }   {  
      name:"name4",
      value:false
   }
]

我想要做的是在文本区域内显示所有对象名称,如果 object.value 为假,则下划线或粗体。然后要能够在文本区域里面写上去掉下划线的元素。

我尝试的是:

<textarea *ngFor="let item of list" [ngClass]="{cssClass: item.value==false}">
{{item.name}}
</textarea>

-这里的问题是它为每个对象显示一个空文本区域和

<div *ngFor="let item of list" [ngClass]="{cssClass: item.value==false}">
<textarea>
{{item.name}}
</textarea>
</div>

这里的问题是它每行创建一个文本区域,该行在里面。

标签: javascripthtmlcssangularweb

解决方案


您的字符串值不是布尔类型。所以你应该使用字符串值'true'与否和。'false'truefalse

<textarea *ngFor="let item of list" [ngClass]="{cssClass: item.value=='false'}">

或者

如果您可以选择修改对象,则将值类型更改为 -

  list =[  
   {  
      name:"name1",
      value:true
   }   {  
      name:"name2",
      value:false
   }   {  
      name:"name3",
      value:true
   }   {  
      name:"name4",
      value:false
   }
]

推荐阅读