迭代遍歷類Angular4

Question

我目前使用Swiper（https://www.npmjs.com/package/angular2-useful-swiper）創建圖像庫。

是否有可能通過迭代對象數組並使用ngClass動態更改div的類？我不確定它是否支持插值。

我不斷收到的錯誤說「標識符樣式」未定義，'數組'不包含這樣的成員。但爲什麼是ngStyle中，H4和p能夠抓住的元素和遍歷它，如果是這樣的話？

slider.component.html

<div class="swiper-container"> 
    <swiper class="swiper" [config]="config"> 
    <div class="swiper-wrapper"> 
     <div class="swiper-slide" *ngFor="let image of images"> 
      <div class="swiper-slide--container"> 
       <div class="symptom-slide-img" 
       [ngClass]="images.style" [ngStyle]="{'background-image': 'url(' + image.src + ')'}"></div> 
       <div class="caption"> 
        <h4>{{ image.title }}</h4> 
        <p>{{ image.caption}}</p> 
       </div> 
      </div> 

     </div> 
    </div> 
    <div class="swiper-button-next"></div> 
    <div class="swiper-button-prev"></div> 
    </swiper> 
</div> 

slider.component.ts

import { Component, OnInit } from '@angular/core'; 
import { NgClass } from '@angular/common'; 

@Component({ 
    selector: 'app-symptoms-slider', 
    templateUrl: './symptoms-slider.component.html', 
    styleUrls: ['./symptoms-slider.component.scss'] 
}) 
export class SymptomsSliderComponent implements OnInit { 

images = [ { 
       'src': './path/image.png', 
       'title': 'Title', 
       'style': 'hvr-pulse-grow', 
       'caption': 
       'Caption' 
      }, 
      { 
       'src': './path/image.png', 
       'title': 'Title', 
       'style': 'hvr-buzz', 
       'caption': 
       'Caption' 
      }, 
      { 
       'src': './path/image.png', 
       'title': 'Title', 
       'style': 'hvr-wobble-vertical', 
       'caption': 
       'Caption' 
      }, 
      { 
       'src': './path/image.png', 
       'title': 'Title', 
       'style': 'hvr-wobble-vertical', 
       'caption': 
       'Caption' 
      }, 
     ]; 

    constructor() { } 

    ngOnInit() { 
    } 
} 

Answer 1

錯字

[ngClass]="images.到[ngClass]="image.（刪除不必要的 'S'）