it-swarm.com.de

So deaktivieren Sie ein Eingabefeld mithilfe von angle.js

Ich verwende dieses Feld für eine Bearbeitungsansicht und eine Erstellungsansicht 

<input data-ng-model="userInf.username"  class="span12 editEmail" type="text"  placeholder="[email protected]"  pattern="[^@][email protected][^@]+\.[a-zA-Z]{2,6}" required />

im Controller habe ich diesen Code, um das Eingabeelement zu deaktivieren:

function($rootScope, $scope, $location, userService)
{

//etc 
    $(".editEmail" ).attr("disabled", disable);  // no idea how to do in angular
}

Bitte helfen.

38
Prashobh

Verwenden Sie ng-disabled oder eine spezielle CSS-Klasse mit ng-class

<input data-ng-model="userInf.username"  
       class="span12 editEmail" 
       type="text"  
       placeholder="[email protected]"  
       pattern="[^@][email protected][^@]+\.[a-zA-Z]{2,6}" 
       required 
       ng-disabled="{expression or condition}"
/>
79
EpokK

Sie müssen die Anweisung ng-disabled verwenden

<input data-ng-model="userInf.username" 
       class="span12 editEmail" 
       type="text" 
       placeholder="[email protected]" 
       pattern="[^@][email protected][^@]+\.[a-zA-Z]{2,6}" 
       required 
       ng-disabled="<expression to disable>" />
12
Arun P Johny

Ich habe dafür eine Direktive erstellt (winkelstabil 1.0.8)

<input type="text" input-disabled="editableInput" />
<button ng-click="editableInput = !editableInput">enable/disable</button>

app.controller("myController", function(){
  $scope.editableInput = false;
});

app.directive("inputDisabled", function(){
  return function(scope, element, attrs){
    scope.$watch(attrs.inputDisabled, function(val){
      if(val)
        element.removeAttr("disabled");
      else
        element.attr("disabled", "disabled");
    });
  }
});
5
user2672859

Ihr Markup sollte ein zusätzliches Attribut mit dem Namen ng-disabled enthalten, dessen Wert eine Bedingung oder ein Ausdruck sein sollte, die entweder als wahr oder falsch ausgewertet wird. 

    <input data-ng-model="userInf.username"  class="span12 editEmail" 
       type="text"  placeholder="[email protected]"  
       pattern="[^@][email protected][^@]+\.[a-zA-Z]{2,6}" 
       required 
       ng-disabled="{condition or expression}"
/>

Im Controller ist möglicherweise Code vorhanden, der den Wert der Direktive ng-disabled beeinflussen könnte.

1
GANESHRAM KS
<input type="text" input-disabled="editableInput" />
<button ng-click="editableInput = !editableInput">enable/disable</button>

app.controller("myController", function(){
  $scope.editableInput = false;
});

app.directive("inputDisabled", function(){
  return function(scope, element, attrs){
    scope.$watch(attrs.inputDisabled, function(val){
      if(val)
        element.removeAttr("disabled");
      else
        element.attr("disabled", "disabled");
    });
  }
});
0
user4391325
<input data-ng-model="userInf.username"  class="span12 editEmail" type="text"  placeholder="[email protected]"  pattern="[^@][email protected][^@]+\.[a-zA-Z]{2,6}" required ng-disabled="true"/>
0
vinodh