This input value should be "Paris" but it does not display. What is wrong with my code?

(function(angular, undefined) {
  var mon_app = angular.module('mon_app', []);
  angular.module('mon_app').controller('monctrl', function($scope) {})
}(window.angular));
<!DOCTYPE html>
<html class="app" ng-app="mon_app">

<head lang="fr" class="app">
</head>

<body>
  <div ng-controller="monctrl">
    This input value is "Paris"
    <input name="lieu" ng-model="lieu" type="text" value="Paris" />
  </div>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.js"></script>
</body>

share
1  
It wont work that way. You need to set $scope.lieu="paris" in your controller to set default value – PSL Jan 21 '15 at 21:11
    
or you can use ng-init – akonsu Jan 21 '15 at 21:12
up vote 5 down vote accepted

You cannot mix regular HTML (the value attribute of your input) and the angular-driven ng-model. The input will always display the value of what's in ng-model, here lieu, hence you should iniialize $scope.lieu with the Paris value.

(function(angular, undefined) {
  var mon_app = angular.module('mon_app', []);
  angular.module('mon_app').controller('monctrl', function($scope) {
    $scope.lieu = "Paname";
  })
}(window.angular));
<!DOCTYPE html>
<html class="app" ng-app="mon_app">

<head lang="fr" class="app">
</head>

<body>
  <div ng-controller="monctrl">
    This input value is "{{lieu}}"
    <input name="lieu" ng-model="lieu" type="text"/>
  </div>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.js"></script>
</body>

share
    
got it! Thanks! – Papa Sax Jan 22 '15 at 18:42
    
@user2761037 If that helped you please +1 and/or accept the answer :) – floribon Jan 22 '15 at 22:17
1  
I would love to, but i actually created my stackoverflow account to ask this question. Vote Up requires 15 reputation. – Papa Sax Jan 23 '15 at 11:33
1  
I see. Let's call it, échange de bon procédé ;-) – floribon Jan 23 '15 at 18:10

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.