码迷,mamicode.com
首页 > 编程语言 > 详细

[AngularJS] Javascript scope and AngularJS $scope

时间:2015-01-03 07:02:25      阅读:409      评论:0      收藏:0      [点我收藏+]

标签:

Scope resolution of our Angular documents works exactly the same way scope resolution works in plain, old Javascript. The only difference here is that what actually matters about scope inheritance is the structure of our dom.

If the child controller doesn‘t have, will find in $rootScope.

 

<!DOCTYPE html>
<html ng-app="app">
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<h1>RootScope</h1>
{{posts | json}}
<div ng-controller="FirstController">
    <h1>FirstController</h1>
    {{posts | json}}
</div>

<div ng-controller="SecondController">
    <h1>SecondController</h1>
    {{posts |  json}}
</div>
<div ng-controller="FirstController">
    <h1>Second as innercontroller (first contains second)</h1>
    <div ng-controller="SecondController">
        {{posts |  json}}
    </div>
</div>

<div ng-controller="SecondController">
    <h1>First as innercontroller (second contains first)</h1>
    <div ng-controller="FirstController">
        {{posts |  json}}
    </div>
</div>

<div ng-controller="FirstController">
    <div ng-controller="SecondController">
        <h1>First & Second don‘t have</h1>
        {{youdonthave}}
    </div>
</div>

<script src="bower_components/angular/angular.min.js"></script>
<script src="./app.js"></script>
</body>
</html>

 

/**
 * Created by Answer1215 on 1/2/2015.
 */
angular.module(‘app‘, [])
    .run(function($rootScope) {
        $rootScope.posts = [7,8,9];
        $rootScope.youdonthave = "All child don‘t have";
    })
    .controller(‘FirstController‘, function($scope) {
        $scope.posts = [1,2,3];
    })
    .controller(‘SecondController‘, function($scope) {
        $scope.posts = [4,5,6];
    })

 

技术分享

 

[AngularJS] Javascript scope and AngularJS $scope

标签:

原文地址:http://www.cnblogs.com/Answer1215/p/4199079.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!