如何在Angular组件中更新div的样式

Question

我想在下拉列表组件中设置元素的样式。我应该使用ngStyle进行设置吗？

以下是模板/ HTML：

<div class="dropdown-items" *ngIf="showList" [style]="top: elHeight">
   <li *ngFor="let item of dropdownItems">
      {{item.name}}
   </li>
</div>

Answer 1

在CSS中使用li {}设置所有下拉列表元素的样式，或者，如果您要设置特定元素的样式，请使用[id] = index为ngFor元素提供ID，然后在CSS中使用#id设置元素的样式

Answer 2

编写两个CSS类并根据条件更新类名称。 例如：

// mprn-status-count.component.html

    <div class="dropdown-items" *ngIf="showList" [ngClass]="(iscssupdate==true)?'updatedclass':'priviousclass'">
       <li *ngFor="let item of dropdownItems">
          {{item.name}}
       </li>   

       </div>

    //component.css
    .updatedclass{
    // update css 
    }        
    .priviousclass{
    // privious css 
    }