迭代遍历类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'）