html 部分
<body ng-app="myapp"> <div ng-controller="asd"> <p><span ng-bind="firstName"></span></p> </div> <div ng-controller="qwe"> <p><span ng-bind="firstName"></span></p> </div>
---------------------------------
script部分
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> var app = angular.module("myapp", []); app.controller('asd', function($scope) { //$scope数据 类似vue中的data $scope.firstName = "John"; // 绑定数据 必须是$scope.xx=xx $scope.lastName = "Doe"; })// 绑定数据 app.controller('qwe', function($scope) { //$scope数据 类似vue中的data $scope.firstName = "zlt"; // 绑定数据 必须是$scope.xx=xx $scope.lastName = "Doe"; })
---------------------
ng-controller 一个页面上可以有多个,还可以嵌套使用,存在父子关系
例如
<div ng-controller="asd"> <p><span ng-bind="firstName"></span></p> <div ng-controller="qwe"> <p><span ng-bind="firstName"></span></p> john </div> </div>
嵌套了一个ng-controller="qwe"
---------------
<script type="text/javascript"> var app = angular.module("myapp", []); app.controller('asd', function($scope) { //$scope数据 类似vue中的data $scope.firstName = "John"; // 绑定数据 必须是$scope.xx=xx $scope.lastName = "Doe"; })// 绑定数据 app.controller('qwe', function($scope) { //$scope数据 类似vue中的data $scope.apple = "123123"; // 绑定数据 必须是$scope.xx=xx $scope.apples = "543"; })// 绑定数据 </script>
子 ng-controller="qwe"的 ng-bind="firstName" 就是 父级的 john
-----------------------------