AngularJS數據綁定查詢

這是一個nooob問題 - 就像我今天開始學習Angular一樣。我正在按照教程Angular JS in 30 mins AngularJS數據綁定查詢

這個想法是在Angular中設置基本的數據綁定。代碼顯示一個輸入框，並顯示（更新）與其相鄰框中鍵入的內容。從Java世界和Spring MVC背景的，它非常有意義，只要代碼如下：

的index.html

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1"> 
<title>Test Angular</title> 
<script type="text/javascript" src="angular.min.js"></script> 
<script type="text/javascript" src="app.js"></script> 
<script type="text/javascript" src="maincontroller.js"></script> 
</head> 
<body> 
<div id="content" ng-app="SampleAngular" ng-controller="MainController"> 
    <input type="text" ng-model="inputVal">{{ inputVal }} 
</div> 
</body> 
</html>

app.js

var app = angular.module('SampleAngular', []);

maincontroller.js

app.controller("MainController", function($scope){ 
$scope.inputVal = ""; 

} 
);

但是，同樣的事情仍然有效，如果我有一個空白的身體控制器即：

maincontroller.js

app.controller("MainController", function($scope){ 


} 
);

我明白，我將無法獲得在控制器inputVal的價值，但

一）爲何仍視圖中的工作嗎？ b）顯然，我沒有在ng-model指令中定義的對應模型'inputVal'，並且沒有錯誤/警告 - 哪怕是恕我直言 - 等同於失敗。這是如何設計Angular的？這是一個潛在的問題，在大型應用程序，並會使調試噩夢？

在此先感謝。

來源

2014-04-23 trishulpani

以下是從api documentation爲ngModel：

注：ngModel會嘗試綁定到通過對當前範圍計算表達式給出的屬性。如果該屬性尚不存在於此範圍內，則該屬性將隱式創建並添加到範圍中。

來源

2014-04-23 06:41:39

謝謝！我應該更仔細地閱讀文檔。 – trishulpani

值得一提的是，其他指令也是如此。例如，ng-init和ng-click經常用於向它們存在的範圍添加屬性。ng-table是一個非常流行的指令，它使用這種技術來擴展和摺疊行組。 http://stackoverflow.com/a/22420192/1245971 –

每當在視圖中使用ng模型時，將在控制器的作用域上創建相應的模型值。 Angular在這種情況下不會拋出任何錯誤，因爲這是它的默認行爲。

$scope.inputVal = "";

更像是初始化所使用的變量。

來源

2014-04-23 06:57:16

AngularJS數據綁定查詢

回答

相關問題