Angular(作用域层次结构)

最新推荐文章于 2024-08-30 20:29:15 发布

dibisha5159

最新推荐文章于 2024-08-30 20:29:15 发布

阅读量100

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/YoogaChan/p/6918320.html

版权

html部分
.........................................................................................
<!doctype html>
<html ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div ng-controller="LevelA">
    <h3>{{title}}</h3>
    ValueA = {{valueA}} <input type="button" ng-click="inc()" value="+" />
    <div ng-controller="LevelB"><hr>
        <h3>{{title}}</h3>
        ValueA = {{valueA}}<br>
        ValueB = {{valueB}}
        <input type="button" ng-click="inc()" value="+" />
        <div ng-controller="LevelC"><hr>
            <h3>{{title}}</h3>
            ValueA = {{valueA}}<br>
            ValueB = {{valueB}}<br>
            ValueC = {{valueC}}
            <input type="button" ng-click="inc()" value="+" />
        </div>
    </div>
</div>
<script src="js/angular-1.3.0.js"></script>
<script src="js/作业3_作用域继承.js"></script>
</body>
</html>
...........................................................................
js部分

myApp=angular.module("myApp",[]);
myApp.controller("LevelA",function ($scope,$rootScope) {
    $scope.valueA=0;  //初始化
    $scope.valueB=0;  //初始化
    $scope.valueC=0;  //初始化
$scope.title="LevelA";

$scope.inc=function () {
    $scope.valueA++;
    $rootScope.valueB++;
    $rootScope.valueC++;
}
})
myApp.controller("LevelB",function ($scope,$rootScope) {
    $scope.title="LevelB";
    $scope.inc=function () {
        $scope.valueB++;
        $rootScope.valueC++;
    }
})
myApp.controller("LevelC",function ($scope) {
    $scope.title="LevelC";
    $scope.inc=function () {
        $scope.valueC++;
    }

})

转载于:https://www.cnblogs.com/YoogaChan/p/6918320.html

dibisha5159

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Angular(作用域层次结构)

html部分.........................................................................................<!doctype html><html ng-app="myApp"><head> <meta charset="UTF-8"> <...
复制链接

扫一扫