Question

我有一个ng-repeat表格。当提交表单时，我想禁用提交表单输入。

我面临的问题是我提交表格时。它禁用所有表单输入，永远不会返回启用。

请查看此fiddle。

或下面的代码段。感谢

在JS中

$scope.newDatas = {

  a1: 'a',
  a2: 'b'

}

$scope.send = function() {
 $scope.isDisabled = true;
 setTimeout(function() {
  alert('done');
  $scope.isDisabled = false;
 },1000);
}

在HTML中

<div ng-repeat="(key, value) in newDatas">
  <form name="newData">
    <input type="text" ng-model="value" ng-disabled="isDisabled">
    {{value}}
    <button ng-click="send()" ng-disabled="isDisabled">submit</button>
  </form>
</div>

Answer 1

您需要调用$ scope。$ digest（）以允许角度捕获更改。

 setTimeout(function() {
  alert('done');
  $scope.isDisabled = false;
  $scope.$digest();
},1000);

或者更好地使用自动执行的$ timeout：

$timeout(function() {
  alert('done');
  $scope.isDisabled = false;
},1000);

Answer 2

它只会禁用提交表单。试试这个：

在HTML中：

<form name="newData">
    <input type="text" ng-model="value" ng-disabled="isDisabled[key]">
    {{value}}
    <button ng-click="send(key)" ng-disabled="isDisabled[key]">submit</button>
  </form>

在控制器中：

   $scope.isDisabled = {};
   $scope.send = function(key) {
      $scope.isDisabled[key] = true;
      $timeout(function() {
        //   alert('done');
            $scope.isDisabled[key] = false;
      },1000);
    }

见WORKING DEMO

Answer 3

setTimeout函数在Angular“scope”之外执行，因此Angular不知道你再次将isDisabled设置为false。

使用$ timeout服务，因为它会将你的函数包装在$scope.$apply内并触发更新绑定的$ digest循环。

angularjs ng-repeat表单仅禁用每个表单输入

3 个答案: