angular 中變量 output 的動態字符串插值

Question

我需要以隨機順序混合測驗問題的答案。

我有像這樣的問題對象：問題= {問題：'德國的首都是什么？'，答案1：'柏林'，答案2：'倫敦'，答案3：'巴黎'，答案4：'羅馬'}

每次我在模板中顯示問題時，我都會生成一個隨機數組，例如 randomOrder = [3,2,0,1]

我想在模板中使用字符串插值來顯示具有隨機答案順序的問題：

問題：{{Question.question}}
答案 1：{{Question.answer'answerOrder[0]'}}
答案 2：{{Question.answer'answerOrder[1]'}}
答案 3：{{Question.answer'answerOrder[2]'}}
答案 4：{{Question.answer'answerOrder[3]'}}

有人可以幫助我了解 angular 的正確語法嗎？ 謝謝

Answer 1

只需通過動態鍵引用 object

Question: {{Question.question}}
Answer1: {{Question['answer'+answerOrder[0]]}}
Answer2: {{Question['answer'+answerOrder[1]]}}

或者您可以將答案存儲為這樣的數組： {question: '...', answers: [a,b,c,d]}

Answer 2

更好的方法是使用字符串插值獲取返回組合字符串的方法，例如：

questionString(n: number): string {
   return `Answer${n+1}: ${questions['answer'+n]}`;
}

並使用，例如：

{{question(1)}}
{{question(2)}}
...

或者比在 for 循環中更好。