[英]boolean value in Angular2 viewmodel does not update *ngIf template
I have a weird behavior I need some help with. 我有一个奇怪的行为,我需要一些帮助。 This is an angular2 and typescript app.
这是一个angular2和打字稿应用程序。
I have a template that contains the following html which uses ngIf : 我有一个模板,其中包含以下使用ngIf的 html:
<div *ngIf="loading" class="row">
<div class="small-3 small-centered columns" >
<img src="/Images/loading_spinner.gif" />
</div>
</div>
I have a button that triggers a function to change the value of loading 我有一个按钮,触发一个函数来改变加载的值
export class ShiftEditComponent implements OnInit {
loading: boolean = false;
setLoading(value: boolean): void {
if (this.loading !== value) {
this.loading = !this.loading;
}
}
}
Here is the weird thing. 这是奇怪的事情。 If i specify the value of the value parameter from somewhere else in the class, the template does not update.
如果我从类中的其他位置指定value参数的值,则模板不会更新。 BUT if I strip out the logic and just assign loading to its opposite, then it works and the template updates and the ngIf shows and does not show accordingly.
但是如果我去除逻辑并且只是向其对面分配加载,则它起作用并且模板更新并且ngIf显示并且不相应地显示。
THIS WORKS: 这个工作:
setLoading(): void {
this.loading = !this.loading;
}
QUESTION: Why does this work and ngIf updates when i just assign the opposite value, but if I try to specify the value through a parameter the ngIf template does not update(show or hide) 问题:当我只分配相反的值时,为什么这会工作和ngIf更新,但如果我尝试通过参数指定值,则ngIf模板不会更新(显示或隐藏)
If i specify the value of the value parameter from somewhere else in the class, the template does not update
如果我从类中的其他位置指定value参数的值,则模板不会更新
A common symptom that you have the wrong this
in that handler 你有错误的一个常见症状
this
在处理程序
Use an arrow function https://basarat.gitbooks.io/typescript/content/docs/arrow-functions.html 使用箭头函数https://basarat.gitbooks.io/typescript/content/docs/arrow-functions.html
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.