0

HTMLページに複数のフォームがあり、それぞれが追加、編集などの操作を実行します。

すべてのフォームには、いくつかの条件をチェックする ng-disabled ディレクティブがあり、いくつかの変更が発生したときに対応する ng-disabled 関数を起動します。

問題は、1 つのフォームで値を変更すると、すべてのフォームのすべての ng-disabled 関数が起動されることです。

コード : 

<body ng-controller="MainCtrl">
    <div ng-form="myForm">
      <input type="text" required ng-model="user.name" placeholder="Username">

      <button ng-click="doSomething()" ng-disabled="check() || myForm.$invalid">DO</button>
    </div>

     <div ng-form="myForm2">
      <input type="text" required ng-model="user.name2" placeholder="Username">

      <button ng-click="doSomething2()" ng-disabled="check2() || myForm2.$invalid">DO</button>
    </div>

  </body>

スクリプト コード: 

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';

  $scope.check = function() {
    console.log("check called");
  }

   $scope.check2 = function() {
    console.info("check two called");
  }

});

プランリンク

モデルの1つが変更されると、コンソールですべての機能が実行されることがわかります。

4

1 に答える 1