角度2

Question

シナリオ内の文字列（DOM）を経由してモデルを渡す方法：多くの文字列を持つことができます

let many = []; 
let timer = 60; 
setInterval(() => timer--, 1000); 
many.push("this is a selection WITH a {{timer}}"); 
many.push("this is a selection WITHOUT a timer"); 

だから、基本的には、配列 "多く" のtheres：

<div *ngFor="let one of many"> 
    <span [innerHtml]="one"></span> 
</div> 

シナリオ（コントローラ）動的に作成されて作成され、 "多くの"文字列に渡された文字列の一部にはカウントダウンがあり、他の文字列にはカウントダウンがありません。上記のように文字列を介してDOMにモデルを渡し、タイマーを更新する方法はありますか？そして、その実現可能性がどのように達成できるか。

私は本当にこれは、 "gotchas" thats soooo明白なisntの1つです。

グラシアス

Answer 1

PLUNKER

これは「ハック」ソリューションのようなものですが、それは動作しますが、余分なコンポーネントを作成する必要はありません。

まず、これにテンプレートを変更します。

<div *ngFor="let one of many"> 
    {{one.replace('[timer]', timer)}} 
</div> 

第二に、クラス変数としてtimerとmanyを宣言：

export class YourComponent { 
    timer:number=60; 
    many:string[]; 

    (...) 
} 

最後に、含めたい時はいつでも、manyに新しい行を追加しますtimer{{timer}}の代わりに[timer]を使用してください。

[timer]を自由に変更することができます。