Question

我正在尝试禁用复选框旁边的按钮，但前提是复选框的基础模型与原始值不同。原始它本身不起作用，因为从技术上讲，形式已经改变。我的解决方案是获取原始值并根据当前值是否等于该值来切换表单的原始值。

我假设有一种更好的方法，我不知道。

    <div ng-controller="MyCtrl">
      <div ng-form="form">
        <div class="checkbox">
          <label>
            <input type="checkbox"  ng-click="toggle(form)" ng-model="foo.bar">{{ foo.bar }}
          </label>
        </div>
        <button class="btn btn-primary" ng-disabled="form.$pristine" ng-click="save(form)">Button</button>
    </div>
  </div>

angular.module("app", [])
  .controller("MyCtrl", function($scope, $timeout){

  //catch when scope is first set
  $scope.$watch("foo", function(curr, prev){
    if(curr && !prev)
      $scope.original = curr.bar;

  });

  //assume this is being set by some other scope
  $timeout(function(){
    $scope.foo = {
      bar: true
    };
  }, 500);

  $scope.toggle = function(form){
    if($scope.original == $scope.foo.bar)
      form.$setPristine();
    console.log(form.$pristine);
  };

  $scope.save = function(form){
     $scope.original = $scope.foo.bar;
    form.$setPristine();
  };
});

Answer 1

我不明白为什么你使用$ pristine或$ watch。

在实例化控制器时，只需将原始值存储在范围变量中，然后使用

ng-disabled="foo.bar != original"

如何根据模型的原始值设置按钮的禁用ng值

1 个答案: