Блог

В моем приложении у меня есть переменная String. Который имеет в строке имя атрибута для добавления.

 ngOnInit()
{
   this.colAttibute = 'width-50';
}    
  

или оно может быть равно ‘width-100’. Мое приложение получает ширину устройства и устанавливает значение этой переменной в методе onNgInit.
Я хочу установить этот атрибут в свой html-код примерно так:

 <ion-list no-lines *ngIf="list">
  <ion-list-header>
    Лидеры продаж
  </ion-list-header>
  <ion-item class="categoryProductItem" *ngFor="let row of list;">
      <ion-row wrap >
        <ion-col *ngFor="let product of row" $colAttibute > <!--Here must be width-50 or width-100 attribute-->
          <a ion-item detail-push (click)="onSelectItem(product)" >
            <div class="categoryProductItemImage" *ngIf="product.getMainImage()">
                <ion-img [src]="product.getMainImage()['small_url']"></ion-img>
            </div>
            <h2>
              {{product.title}}
            </h2>
          </a>
        </ion-col>
      </ion-row>
  </ion-item>
</ion-list>
  

Как это сделать?

Вы можете установить ширину следующим образом:

 <ion-col [attr.width-70]="flag">
  

Где flag — это логическое значение, указывающее, применять этот атрибут или нет.
К сожалению, вам нужно будет перечислить все доступные атрибуты, чтобы поддерживать их все динамически.