<div ng-app="myApp1" ng-controller="myCtrl1">
名: <input type="text" ng-model="firstName"><br>
姓: <input type="text" ng-model="lastName"><br>
<br>
姓名: {{firstName + " " + lastName}}
</div>
<br><br>
<div ng-app="myApp2" ng-controller="myCtrl2">
名: <input type="text" ng-model="firstName"><br>
姓: <input type="text" ng-model="lastName"><br>
<br>
姓名: {{firstName + " " + lastName}}
</div>
<br><br>
<div ng-app="myApp3" ng-controller="myCtrl3">
名: <input type="text" ng-model="firstName"><br>
姓: <input type="text" ng-model="lastName"><br>
<br>
姓名: {{firstName + " " + lastName}}
</div>
<script>
//定义模块应用
var app = angular.module('myApp1', []);
//定义控制器应用
app.controller('myCtrl1', function($scope) {
// $scope相当于作用域、控制范围,是用来保存Model的对象
$scope.firstName= "qiu";
$scope.lastName= "su";
});
var app2 = angular.module('myApp2', []);
//定义控制器应用
app2.controller('myCtrl2', function($scope) {
// $scope相当于作用域、控制范围,是用来保存Model的对象
$scope.firstName= "qiu";
$scope.lastName= "su";
});
//手动地让第二个div被myapp2管理
angular.bootstrap(document.querySelector('[ng-app="myApp2"]'), ['myApp2']);
var app3 = angular.module('myApp3', []);
//定义控制器应用
app3.controller('myCtrl3', function($scope) {
// $scope相当于作用域、控制范围,是用来保存Model的对象
$scope.firstName= "qiu";
$scope.lastName= "su";
});
//手动地让第三个div被myapp3管理
angular.bootstrap(document.querySelector('[ng-app="myApp3"]'), ['myApp3']);
</script>
angularJS 单页面 两个及以上个 ng-app 的处理方式
最新推荐文章于 2021-06-22 05:32:59 发布