多个ng禁用输入

Question

以下是我尝试在表单中禁用多个输入框的代码段，我需要只启用所需的组，其余应该进入禁用模式我开始键入所需的组。我正在寻找是否有人可以帮助我使它成为一个组件或指令，我可以减少代码行并增加其重用。

<div ng-controller="formController">
    <form  id="searchForm" novalidate>
    <fieldset><legend>Primary Search Field</legend>
     <div class="form-group">       <div class="row">
            <label>Card #</label>            <input type="text" ng-model="user.cardnumber" ng-change="ResetGroup()" ng-disabled="Group1" placeholder="Card holder Number" required>
        </div>      
        <div class="row">           <label>Plastic #</label>            <input type="text" ng-model="user.plasticNumber" ng-change="ResetGroup()" ng-disabled="Group1" placeholder="Enter Plastic #">       </div>      </div>       <div class="form-group">
        <div class="row">           <label>First Name</label>    <input type="text" ng-model="user.firstName" ng-change="ResetGroup()" ng-disabled="Group2" placeholder="First Name" ng-disabled="error || incomplete"> </div>      
        <div class="row">
            <label>Last Name</label>
            <input type="text" ng-model="user.lastName" ng-change="ResetGroup()" ng-disabled="Group2" placeholder="Last Name" required>
        </div>      
        <div class="row">
            <label>Account #</label>
            <input type="text" ng-model="user.accountNumber" ng-change="ResetGroup()" ng-disabled="Group3" placeholder="Account Number" required>
        </div>      
        <div class="row">
            <label>zzzz Type</label>
            <select ng-model="user.account" ng-change="ResetGroup()" ng-disabled="Group3" ng-options=''>   <option value="0">-- choose account Type --</option>
                            <option value="1">1</option>
            </select>
        </div>
    </div>
        <div class="row">
            <label>yyyyyID</label>
            <input type="text" ng-model="user.govtID" ng-change="ResetGroup()" ng-disabled="Group4" placeholder="Govt ID" required>
        </div>

        <div class="row">
            <label>xxxx ID</label>
            <input type="text" ng-model="user.custID" ng-change="ResetGroup()" ng-disabled="Group5" placeholder="Customer ID" required>
        </div>     
    </fieldset>



    <fieldset><legend>Additional Search Field</legend>
     <div class="form-group">
        <div class="row">
            <label>Status</label>
            <select ng-model="user.status"   ng-options=''>
          <option value="0">-- choose card status --</option>
           <option value="1">Enabled</option>

        </select>
        </div>  
     </div>
    </fieldset>

    <div class="btnBlock">
        <button ng-click="submit">Submit</button>
    </div>
        </form>

    </div>

  

我已经使用以下解决方案完成了上述操作，但是我可以使用Angular中的指令或任何其他紧凑方式来执行此操作。

app.controller('formController',  function($scope) {
    $scope.user = {};
     $scope.group0 = true;
    $scope.group1 = false;
$scope.group2 = false;
$scope.group3 = false;
$scope.group4 = false;
$scope.group5 = false;

    function ValidValue(value){
        if(value != undefined && value.length>0) return true;
        else
            return false;
    };

    $scope.ResetGroup = function () {
        //alert($scope);
        if (ValidValue($scope.user.cardnumber) || ValidValue($scope.user.plasticnumber)) {

$scope.group2 = true;
$scope.group3 = true;
$scope.group4 = true;
$scope.group5 = true;
        }
        else if(ValidValue($scope.user.lastName) || ValidValue($scope.user.firstName)){
            $scope.group1 = true;
$scope.group3 = true;
$scope.group4 = true;
$scope.group5 = true;

        }
        else if(ValidValue($scope.user.accountNumber) || ValidValue($scope.user.account)){
              $scope.group2 = true;
$scope.group1 = true;
$scope.group4 = true;
$scope.group5 = true;

        }
        else if(ValidValue($scope.user.govtID)){
            $scope.group2 = true;
$scope.group3 = true;
$scope.group1 = true;
$scope.group5 = true;
        }
        else if(ValidValue($scope.user.custId)){
     $scope.group2 = true;
$scope.group3 = true;
$scope.group4 = true;
$scope.group1 = true;
}

else
   $scope.group0 = true;

}
});