Question

我有一个按钮，用于将数组中的两个字符串之一分配给变量。

然后，使用[ngSwitch]我只显示一个段落。

似乎没有一个段落出现，我只是在每次单击按钮时收到随机警报。

哦，该组件在主要组件上被调用。

animations.component.html

<button (click)="chooseAnimation()">button</button>

<div [ngSwitch]="animation">
    <div *ngSwitchCase="splittingImage">
       <p> splitting </p>  
    </div>

    <div *ngSwitchCase="zoomAndBlur">
        <p> zooming </p> 
   </div>
</div>

animations.component.ts

export class AnimationsComponent implements OnInit {

animation;
animations = ['zoomAndBlur','splittingImage'];

ngOnInit(){
 }

chooseAnimation(){
    this.animation = this.animations[Math.floor(Math.random() * this.animations.length)];
    alert(this.animation); //this works fine and alerts zoomAndBlur or splittingImage. 
}

constructor() {

}

Answer 1

尝试将* switchCase值包装在单引号中。

<div *ngSwitchCase="'splittingImage'"> 和 <div *ngSwitchCase="'zoomAndBlur'">

正确的ngSwitchCase不会使段落出现

1 个答案: