web-dev-qa-db-fra.com

Comment activer ou désactiver les champs de saisie de manière dynamique dans la conception de matériau js angulaire

J'ai un problème avec ng-disable. comme j'utilise un matériau angulaire, je pense que cela ne fonctionne pas. Je souhaite que ma zone de saisie soit désactivée ou activée de manière dynamique en fonction des conditions.

Remarque: - J'ai plusieurs champs de saisie que je veux désactiver ou activer tous d'un coup.

J'essaye comme ça

<md-input-container class="md-block" flex-gt-sm>
    <label for="Autocomplete">From</label>
    <input required type="text" class = "hideShadow" ng-model="FromLocation"
           uib-typeahead="state for state in states | filter:$viewValue | limitTo:8" 
          class="form-control" ng-disabled="isDisabled">
    <div ng-messages="searchFlight.FromLocation.$error">
    <div ng-message="required">Please enter from location</div>
     </div>
</md-input-container>

J'essaie d'accéder ng-disabled="isDisabled" dynamiquement comme ceci

$scope.isDisabled = true;

Mais ça ne fonctionne pas. Puis-je savoir où je me trompe?

4
Hemanth Paluri

Je crois que le problème réside dans la façon dont vous avez lié la propriété isDisabled.

essaye ça:

$scope.model = {
    isDisabled: true
};

Ensuite:

ng-disabled="model.isDisabled"

Ce problème se produit lorsque nous essayons de lier une propriété primitive sur une directive. Nous devons lier un attribut d'un objet pour fonctionner correctement.

5
Fernando Soares

Vous pouvez activer ou désactiver le champ en utilisant ng-disabled

Par exemple, si vous souhaitez désactiver un bouton initialement et après avoir effectué quelque chose, vous souhaitez activer le bouton,

<button class="btn btn-default" type="submit" ng-disabled="isDisabled" ng-click="ok()">OK</button>

$scope.isDisabled = true;

$scope.save = function(){
//after completing the operation set the values of variable to false
$scope.isDisabled = false;
}
1
meenal