angular JS

Question

ng devre dışı bırakma düğmesini yeniden etkinleştirmek AngularJS'ye yeni gelen biriyim. Varsayılan olarak ng-disabled kullanarak devre dışı bırakılmış alanları olan bir form oluşturdum. <button> numarasını tıkladığımda, bu alanların yeniden etkinleştirilmesini istiyorum. denetleyicisi

function ExchangeController($scope, $http, $cookieStore, $location) { 
    var edit_exchange_setting = "https://pvbp.com/api/settings.html?contactid=292351&exchange_id=7124&clearinghouseid=1&token=e5349652507c0esae86d50fdbdc53222cf97&page=view"; 
     $http.get(edit_exchange_setting).success(function(response){ 
     $scope.exchange_dt.exchange_name = response.name; 
     $scope.exchange_dt.exchange_host_name = response.host_name; 
     $scope.exchange_dt.exchange_last_processed_date = response.address; 
     }); 

     $scope.edit_exchange_setting_click = (function(){ 
     // how can i make the fields re enable here 

     }); 
    } 

Answer 1

kapsamı değişken oluşturmak

HTML

<form class="form-horizontal" role="form" ng-submit="edit_setting()" ng-controller="ExchangeController"> 
    <div class="form-group"> 
     <label>Name</label> 
     <div class="col-sm-6"> 
     <input type="text" class="form-control" ng-model="exchange_dt.name" ng-disabled="true"> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label>Host Name</label> 
     <div class="col-sm-6"> 
     <input type="text" class="form-control" ng-model="exchange_dt.host_name" required ng-disabled="true"> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label>Address</label> 
     <div class="col-sm-6"> 
     <input type="text" class="form-control" ng-model="exchange_dt.address" ng-disabled="true"> 
     </div> 
    </div> 
    </form> 

Kontrolör,

$scope.disabled= true; 

ve bu değişkene gibi tüm ng-disabled yerine

,

...ng-model="exchange_dt.name" ng-disabled="disabled".... 

Düzenleme butonuna tıklayın

Sen denetleyici üst kısmında bir değişken oluşturmak için gereken

$scope.edit_exchange_setting_click = (function(){  
    $scope.disabled = false; 
}); 

Answer 2

$scope.mydisabled=true; 

sonra değişkenle ng-devre dışı set söylemek gibi false için $scope.disabled set

ng özürlü =

ve o "mydisabled" düzenlemek düğmeye Tıkla o değişken için true veya false bir ayarlayıcı value.and tutarak bir kapsam değişken olabilir yanlış

$scope.mydisabled=false; 

GÜNCELLEME Fiddle

Answer 3

için değerini ayarlayın.

function ExchangeController($scope, $http, $cookieStore, $location) { 
var edit_exchange_setting = "https://pvbp.com/api/settings.html?contactid=292351&exchange_id=7124&clearinghouseid=1&token=e5349652507c0esae86d50fdbdc53222cf97&page=view"; 
    $http.get(edit_exchange_setting).success(function(response){ 
    $scope.exchange_dt.exchange_name = response.name; 
    $scope.exchange_dt.exchange_host_name = response.host_name; 
    $scope.exchange_dt.exchange_last_processed_date = response.address; 
    }); 

    $scope.edit_exchange_setting_click = (function(){ 
    // how can i make the fields re enable here 

    }); 

    $scope.dtName=true; 
    $scope.isdtNameDisabled=function() 
    { 
     return $scope.dtName; 
    }; 
    $scope.updatedtName=function(flag) 
    { 
    $scope.dtName=flag; 
}; 

}

ve HTML'nize o alıcı işlevi bağlayabilir.

<div class="form-group"> 
    <label>Name</label> 
    <div class="col-sm-6"> 
    <input type="text" class="form-control" ng-model="exchange_dt.name" ng-disabled="isdtNameDisabled()> 
    </div> 
</div> 

Answer 4

Farklı (ancak benzer) bir yaklaşım fieldset daki formu içeriğini kaydırmak için ve ng özürlü olan fieldset sadece ziyade tüm giriş alanlarında. Html'yi daha temiz hale getirmek için.

<form class="form-horizontal" role="form" ng-submit="edit_setting()" ng-controller="ExchangeController"> 
    <fieldset ng-disabled ="isFormSetForSaving"> 
    <div class="form-group"> 
     <label>Name</label> 
     <div class="col-sm-6"> 
     <input type="text" class="form-control" ng-model="exchange_dt.name"> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label>Host Name</label> 
     <div class="col-sm-6"> 
     <input type="text" class="form-control" ng-model="exchange_dt.host_name" required> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label>Address</label> 
     <div class="col-sm-6"> 
     <input type="text" class="form-control" ng-model="exchange_dt.address"> 
     </div> 
    </div> 
    </fieldset> 
    </form> 

ve şimdi mantık gereği doğru/yanlış olarak isFormSetForSaving set denetleyicisi.

function ExchangeController($scope, $http, $cookieStore, $location) { 
    $scope.isFormSetForSaving = true; 
    var edit_exchange_setting = "https://pvbp.com/api/settings.html?contactid=292351&exchange_id=7124&clearinghouseid=1&token=e5349652507c0esae86d50fdbdc53222cf97&page=view"; 
     $http.get(edit_exchange_setting).success(function(response){ 
     $scope.exchange_dt.exchange_name = response.name; 
     $scope.exchange_dt.exchange_host_name = response.host_name; 
     $scope.exchange_dt.exchange_last_processed_date = response.address; 
     }); 

     $scope.edit_exchange_setting_click = (function(){ 
     // how can i make the fields re enable here 
      $scope.isFormSetForSaving = false; 
     }); 
    }