提问人：Bhagya Swamy 提问时间：6/17/2019 最后编辑：georgeawgBhagya Swamy 更新时间：7/27/2019 访问量：583
在 if 语句中添加 settimeout 以更新布尔值
Adding a settimeout inside if statement to update the boolean value
问：
我正在设置一个布尔值，一个输入键向上的值。我有一个逻辑来检查我的输入值，根据我正在设置该布尔值。在其他条件下，我想让我的布尔值为 true，然后在一秒钟后为 false。我希望它只是一秒钟的真实性。我在 HTML 中使用这个布尔值来添加一个类（要设置背景，它应该在 1 秒后消失）。但我下面的逻辑不起作用。请帮帮我。
[HTML全文]
<input
type="text"
data-ng-class="{'inputBgChange': controller.firstAmountUpdated}"
ng-keyup="controller.myFunction()"
>
CSS的
.inputBgChange {background-color: red;}
JS系列
myFunction() {
const diffBeforeUpdate = this.secondAmount - this.firstAmount;
const diffAfterUpdate = this.secondAmount - this.prevfirstAmount;
if((diffBeforeUpdate >= 50 && diffAfterUpdate >= 50) || this.secondAmount === '') {
this.firstAmount = this.prevfirstAmount;
this.firstAmountUpdated = false;
} else {
this.firstAmount = parseInt(this.secondAmount) - 50;
this.firstAmount >= 0 ? this.firstAmountUpdated = true : this.firstAmountUpdated = false;
setTimeout(() => this.firstAmountUpdated = false
, 1000);
}
}
firstAmountUpdated是我想在 setTimeout 中更新的布尔值。
答：
0赞
yuval.bl
6/17/2019
#1
我认为贾西是对的。
您可以通过在函数在超时后运行时检查上下文来测试上下文：this
setTimeout(
() => {
console.log(this);
this.firstAmountUpdated = false;
}
, 1000);
如果得到 ，可以事先绑定函数：undefined
const timeoutFunc = () => this.firstAmountUpdated = false;
setTimeout(timeoutFunc.bind(this), 1000);
评论
0赞
Bhagya Swamy
6/18/2019
我试过了，但它没有进入设置超时。我已经在我的类构造函数中设置了this.firstAmountUpdated = false。
0赞
yuval.bl
6/18/2019
因此，要绑定到使用该类创建的实例。
0赞
georgeawg
7/27/2019
#2
而不是使用 ，使用 AngularJS $timeout服务：setTimeout
myFunction() {
const diffBeforeUpdate = this.secondAmount - this.firstAmount;
const diffAfterUpdate = this.secondAmount - this.prevfirstAmount;
if((diffBeforeUpdate >= 50 && diffAfterUpdate >= 50) || this.secondAmount === '') {
this.firstAmount = this.prevfirstAmount;
this.firstAmountUpdated = false;
} else {
this.firstAmount = parseInt(this.secondAmount) - 50;
this.firstAmount >= 0 ? this.firstAmountUpdated = true : this.firstAmountUpdated = false;
̶s̶e̶t̶T̶i̶m̶e̶o̶u̶t̶(̶(̶)̶ ̶=̶>̶ ̶t̶h̶i̶s̶.̶f̶i̶r̶s̶t̶A̶m̶o̶u̶n̶t̶U̶p̶d̶a̶t̶e̶d̶ ̶=̶ ̶f̶a̶l̶s̶e̶
this.$timeout(() => this.firstAmountUpdated = false
, 1000);
}
}
AngularJS 通过提供自己的事件处理循环来修改正常的 JavaScript 流程。这会将 JavaScript 拆分为经典和 AngularJS 执行上下文。只有在 AngularJS 执行上下文中应用的操作才能从 AngularJS 数据绑定、异常处理、属性监视等中受益。
$timeout 服务将该方法与 AngularJS 框架及其摘要周期集成在一起。setTimeout
有关更多信息，请参阅 。
评论
thisI am using this boolean in HTML to add a class (to set a background, it should fade away after 1 sec)- 听起来可以用CSS解决