我有两个相同的应用程序(除app /控制器名称之外)。第一个按预期工作,第二个显然根本没有执行。
我的代码(jsfiddle):
<div ng-app="passwdtool" ng-controller="PasswordController">
Password: <input ng-model="pass" required type="text"><br>
<span>{{ hash }}</span><br>
</div>
<div ng-app="passwdtool2" ng-controller="PasswordController2">
Password: <input ng-model="pass" required type="text"><br>
<span>{{ hash }}</span><br>
</div>
angular.module('passwdtool', [])
.controller('PasswordController', ['$scope', function($scope) {
$scope.pass = "password";
$scope.hash = "a hash";
}]);
angular.module('passwdtool2', [])
.controller('PasswordController2', ['$scope', function($scope) {
$scope.pass = "password";
$scope.hash = "a hash";
}]);
输出:
密码:[
password
]
哈希
密码:[]
{{hash}}
发生了什么事?
答案 0 :(得分:2)
AngularJS尝试找到第一个ng-app并启动它。 如果您要在html中定义其他ng-app,则必须明确启动它们。
该功能是:
angular.bootstrap(<elements on which the ng-app will be attached>, <ng-app name>);
在你的情况下它应该是:
var domElement = document.getElementById('app2'); //attach app2 id to the element.
angular.bootstrap(domElement, ["passwdtool2"]);
此功能用于您在同一页面上需要多个ng-app的情况。 看到这个小提琴,我修改了你的: https://jsfiddle.net/7bew5q0r/2/
另外,你甚至不需要第二个ng-app,因为angular无论如何都会忽略它。 所以更新: https://jsfiddle.net/7bew5q0r/3/