将控制器定义为全局函数时,一切正常.但是当使用模块声明并"分配"控制器时,只使用第一个控制器来解析绑定.我错过了什么?
<!doctype html>
<html>
<head/>
<body>
<div ng-app="flintstones">
<div ng-controller="flintstoneCtrl">
<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
</div>
<div ng-app="rumbles">
<div ng-controller="rumbleCtrl">
<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script>
var flintstones = angular.module("flintstones", []);
flintstones.controller("flintstoneCtrl", function flintstoneCtrl($scope) {
$scope.yourName = "Fred";
});
var rumbles = angular.module("rumbles", []);
rumbles.controller("rumbleCtrl", function rumbleCtrl($scope) {
$scope.yourName = "Barney";
});
</script>
</html>
Run Code Online (Sandbox Code Playgroud)
Mar*_*tin 12
@Arun是对的.但是,在你的情况下,我猜你真的不想两次引导Angular,而只是使用在不同模块中定义的控制器.
这通常是由具有网页/网站的模块,对所需的所有模块的依赖关系,你的情况做flintstones和rumbles.
angular.module('flintstones', []).controller('flintstoneCtrl', ...);
angular.module('rumbles', []).controller('rumbleCtrl', ...);
// Create a module with dependencies.
angular.module('myApp', ['flintstones', 'rumbles'])...
Run Code Online (Sandbox Code Playgroud)
在您的html中,您只需使用ng-app="myApp"该模块中的内容,并且可以访问其所有依赖项.
<html ng-app="myApp">
<body>
<div ng-controller="flintstoneCtrl">...</div>
<div ng-controller="rumbleCtrl">...</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
18635 次 |
| 最近记录: |