CODEWITHSUNDEEP
javascriptangularjs
Exception
Exception

Reputation: 8379

Why this is not working in AngularJS

My HTML goes like this 

<div ng-controller = "AppControl">
   <input type="text" id="nameText" ng-model="yourName" value="{{name}}">
   <h1>You are typing : {{yourName}}</h1>
</div>

And JavaScript is here 

var Application = {};
var App = angular.module('Application', []);
function AppControl($scope){
  $scope.name = "Name";
}

My expected result is : "Name" should come in textbox as it was assigned through $scope. As textbox is model, so <h1> tag should be updated with initial value and should be changed whenever I update it. But When I update it is updating value, but initial value is not coming in text box.

Upvotes: 0

Views: 87

Answers (1)

Yoshi
Yoshi

Reputation: 54649

drop value="{{name}}" and assign to your model (e.g. $scope.yourName= "Name";). Angular will handle the rest.

<div ng-controller="AppControl">
   <input type="text" id="nameText" ng-model="yourName">
   <h1>You are typing : {{yourName}}</h1>
</div>

var Application = {};
var App = angular.module('Application', []);
function AppControl($scope){
  $scope.yourName = "Name";
}

demo: http://jsbin.com/efadal/1/

Upvotes: 2

Related Questions