javascript - How to disable an input box using angular.js

Question

I am using this field for an edit view and a create view

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

in the controller I have this code to disable the input element:

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

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

Please help.

Answer 1

Use ng-disabled or a special CSS class with ng-class

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