Question

我有在页面加载时调用的方法，然后在html中创建一个按钮以调用相同的方法时调用。我没有看到我期望的变化。我有一个歌曲列表，当用户单击随机播放按钮时，它应该随机播放歌曲列表。

当前在页面加载中我有

public musicList = [];

public ngOnInit(){
  this.shufflePlaylist();
}

public shufflePlaylist(){
....code...
}

public shuffleBtnClick(){
   this.shufflePlaylist();
}

在我的html中，我有：

<ul *ngFor="let song of musicList">
<li>{{song}}</li>
</ul>

点击功能：

<span (click)="shuffleBtnClick()">shuffle</span>

我是否缺少在shuffleBtnClick之后更新我的歌曲列表所需的绑定类型？

Answer 1

我认为您的问题与变更检测有关。添加以下更新并测试，看看是否可以解决您的问题。

import { ChangeDetectorRef } from '@angular/core';

constructor(
   private _cdRef: ChangeDetectorRef
) {}

public shufflePlaylist(){
    ....code...
    this._cdRef.detectChanges();
}

上面的代码强制角度引擎检查更改检测，以识别阵列更新。

加载ngOnint后未在点击时触发方法

1 个答案: