AngularJS: read only input with ng-readonly

Question

I have a weird problem with passing a boolean to a text. Here is jsfiddle

<div ng-app ng-controller="MainCtrl">     <p>First Name:     <input ng-model="first" ng-readonly="true"/>     </p>     <p>Last Name:         <input ng-model="second" ng-readonly="{{truefalse}}"/>     </p> </div>  function MainCtrl($scope) {     $scope.first = "Angular";     $scope.second = "JS";     $scope.truefalse = "true"; } 

Can someone explain me why second field is still modifiable?

Answer 1

You need to pass your scope in ng-readonly without Braces. And $scope.truefalse shouldn't be a string, so you don't need quotes.

<div ng-app ng-controller="MainCtrl">     <p>First Name:     <input ng-model="first" ng-readonly="true"/>     </p>     <p>Last Name:         <input ng-model="second" ng-readonly="truefalse"/>     </p> </div>  function MainCtrl($scope) {     $scope.first = "Angular";     $scope.second = "JS";     $scope.truefalse = true; }