AngularJS绑定点击确认后未更新问题求助

嘿，这个问题我太熟悉了！本质上是AngularJS的脏检查机制在搞鬼，咱们一步步拆解解决：

问题根源 #

你用了原生的setTimeout，这个函数是脱离AngularJS上下文执行的。Angular的视图更新依赖它的digest循环（也就是脏检查）——只有在Angular自己管控的异步操作（比如$http、$timeout）里，它才会自动触发digest循环，检测模型变量的变化并同步到视图。

而原生setTimeout里修改vm.confirm的操作，Angular完全“不知情”，所以即使控制台显示变量已经变成false，视图也不会跟着更新。

解决方案（两种方式，推荐第一种） #

1. 用Angular自带的$timeout替代原生setTimeout #

这是最符合Angular最佳实践的方式，$timeout是Angular封装的定时器服务，它会自动在回调执行后触发digest循环，让视图同步更新。

首先要确保你的控制器里注入了$timeout服务，然后修改代码：

coeficienteFactory.saveProjectCoeficient(vm.id_project, vm.coeficient)
 .then(function succesCallback(response) {
     console.log('true!!!');
     vm.confirm = true;
     // 替换成Angular的$timeout
     $timeout(function(){ 
         vm.confirm = false; 
         console.log("disappears!!!")
     }, 2000);
 }).catch(function errorCallback(response) {
     console.log(response)
 });

2. 手动触发digest循环（不推荐，但适合理解原理） #

如果非要保留原生setTimeout，可以在修改模型后手动调用$scope.$apply()，告诉Angular“我改了模型，快更新视图！”。

注意要先在控制器中注入$scope：

coeficienteFactory.saveProjectCoeficient(vm.id_project, vm.coeficient)
 .then(function succesCallback(response) {
     console.log('true!!!');
     vm.confirm = true;
     setTimeout(function(){ 
         vm.confirm = false; 
         console.log("disappears!!!");
         // 手动触发digest循环
         $scope.$apply();
     }, 2000);
 }).catch(function errorCallback(response) {
     console.log(response)
 });

⚠️ 小提醒：如果当前已经处于digest循环中调用$apply()会报错，所以这种方式不如$timeout稳妥。

关联你提到的表格值更新问题 #

你说的表格内值点击确认后不更新、重置为0的问题，本质和这个提示框不消失是同一个原因——模型修改操作脱离了Angular的上下文（比如用了原生事件、第三方库回调或者原生定时器），导致Angular没检测到模型变化，视图也就没同步。

解决思路完全一致：要么把异步操作换成Angular提供的API（比如$timeout、$http），要么在修改模型后手动触发$scope.$apply()。

内容的提问来源于stack exchange，提问作者jamesbcn