爲什麼這不是在AngularJS工作

Question

我的HTML是這樣的

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

和JavaScript是這裏

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

我預期的結果是：「姓名」應該進來的文本框，因爲它是通過分配$scope。 由於文本框爲model，所以<h1>標籤應該更新爲初始值，每當我更新它時都應該更改。但是，當我更新它是更新值，但初始值不在文本框中。

Answer 1

drop value="{{name}}"並分配給您的模型（例如$scope.yourName= "Name";）。 Angular會處理剩下的事情。

<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"; 
} 

演示：http://jsbin.com/efadal/1/