Javascript 函数未按预期执行

Question

我试图在循环运行时禁用一些输入框，然后在循环完成后启用它。我想用 AngularJS 来做到这一点。我在循环开始之前将范围变量设置为 true，然后在循环完成时将其设置为 false。

执行此操作时，循环期间不会禁用任何内容。就好像直到循环完成之后它才被设置为 false 时才消化该函数。

我也尝试过使用 jquery，它的 react 也是一样的。

HTML

<input class="form-control" type="text" ng-model="lineToChange.QtyOrd" ng-disabled="disableLinePartial"  />

JS

   $scope.updateFreight = function (firstLineIndex) {
        //jQuery method acts the same
        //$("input[ng-disabled='disableLinePartial']").attr("disabled");

        $scope.disableLinePartial = true;

        angular.forEach($scope.data.SalesOrder.Lines, function (e, i) {
            //great functions here
        });
        $scope.disableLinePartial = false;
    };

我是否遗漏了 JS 解析的某些内容？有什么更好的方法来做到这一点？

Answer 1

Angular 循环更新 HTML:他们称之为消化循环。您对 $scope 所做的更改不会反射(reflect)在 HTML 中，同时 updateFreight() 函数尚未返回。

你可以:

1) 首先$scope.disableLinePartial = true

2)

 $timeout(function() {
       // do your loop here

       $scope.disableLinePartial = false;
 });

$timeout 将允许应用 $scope 更改，并且仅在至少一个摘要周期后执行循环。

您可能还想了解 $scope.$applyAsync() 和 $scope.$evalAsync()

参见: http://blog.bguiz.com/post/60397801810/digest-cycles-in-single-page-apps/