0

我正在编写一个小角度应用程序，用户可以在其中选择一部电影并将其添加到他最喜欢的列表中。然后显示收藏夹列表，并且每个选定的电影都有一个指向show/hide显示电影情节的 div 的按钮。

这是我的html：

<div *ngFor="let favMovie of favMovies; index as index" class="">
    <div class="card m-2" style="width: 12rem;">
        <img class="card-img-top" src="{{favMovie.poster}}" alt="Card image cap">
        <div class="card-body">         
            <button class="btn btn-sm btn-outline-primary mb-2" (click)="showPlot(index)">Plot</button>         
          <div class="text-center">
          <h5 class="card-title"><b>{{favMovie.title}}</b></h5>
          </div>
          <div *ngIf="showPlotValue[index]">
             <p class="card-text">{{favMovie.plot}}</p>
          </div>
        </div>    
      </div>
</div>

和我的 component.ts

export class MovieListComponent implements OnInit {

  @Input() favMovies: any;  
  
  showCastValue= [false]
  showPlotValue= [false]
  

  
  showPlot(index: number) {    
    this.showPlotValue[index] = !this.showPlotValue[index];
  };
}

奇怪的是它起作用了。既然声明 showCastValue为具有单个值的数组并且我可以访问this.showPlotValue[index]大于一的索引，那怎么可能呢？

4

1 回答 1

1 
 *ngIf="showPlotValue[index]"

没有价值时不测试真/假！它对值是否存在的测试：如果没有值，那么它将返回假（但是如果有一个值，它将测试它的真假）检查真假与真假。这篇文章应该对你有所帮助。

https://howtodoinjava.com/typescript/truthy-and-falsy/

于 2020-12-20T18:56:38.973 回答