Angular 設計按鈕隨機取出陣列資料

angular

vivian00724 2021-11-23 18:20:23 ‧ 785 瀏覽

請問若一個陣列包含多個object

例如這個

要怎麼設計出按按鈕能隨機取出裡面一組的value值
結果這樣

希望是在html用插值綁定顯示出來
在component 裡面應該要怎麼寫出隨機呼叫一組的功能讓html顯示

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

albert41

iT邦新手 3 級 ‧ 2021-11-23 22:03:47

最佳解答

可以另外開一個 property 作為隨機選取的 Pokemon objet, 然後 template 綁定這個 property 做為顯示。

private _pokemonList: Pokemon[] = [ /* ... */ ];
public selectedPokemon: Pokemon;
public counter: number = 0;

ngOnInit() {
    getRandomPokemon();
}

public getRandomPokemon() {
    this.counter++;
    const randomIndex = Math.floor(Math.random() * this._pokemonList.length);
    this.selectedPokemon = this._pokemonList[randomIndex];
}

回應 2
分享
檢舉

vivian00724 iT邦新手 5 級 ‧ 2021-11-24 10:42:42 檢舉

原來如此！謝謝你～

vivian00724 iT邦新手 5 級 ‧ 2021-11-25 17:41:52 檢舉

https://ithelp.ithome.com.tw/questions/10206309

我遇到一個延伸問題如果object裡有屬性是any 上面的寫法會出錯誤訊息 any無法作為索引值這個要怎麼辦

登入發表回應

我要發表回答

立即登入回答

Angular 設計按鈕隨機取出陣列資料

1 個回答

我要發表回答

標記使用者