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数据绑定查询

回答

相关问题