场景(DOM):
<div *ngFor="let one of many">
<span [innerHtml]="one"></span>
</div>
场景( Controller ):
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");
所以基本上有一个数组“many”,它可以将许多动态创建的字符串插入其中,并且传递给“many”的一些字符串有倒计时,而其他则没有。有没有办法通过如上所示的字符串将模型传递到 DOM 并更新计时器?如果可行,如何实现。
我真的希望这不是那些显而易见的“陷阱”之一。
谢谢
最佳答案
这是一种“hacky”解决方案,但它确实有效,您不需要创建额外的组件。
首先,将您的模板更改为:
<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]
更改为任何您想要的。
关于javascript - 如何在 Angular 2 中通过字符串传递模型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41419578/