一、angularJs的作用域

　　&scope这是局部作用域，先在局部作用域中找，如果没有就在全局作用域中找

　　  &rootScope这是全局作用域

<!DOCTYPE HTML>

<html ng-app>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>angular概述</title>

<script src="angular.min.js"></script>

<script>

function Aaa($scope,$rootScope){  //加上$rootScope这个可以是age显示出来，相当于全局的作用域

    $scope.name = 'hello';

    $scope.age = '40';

}

function Bbb($scope){

    $scope.name = 'hi';

}

</script>

</head>

<body>

<div ng-controller="Aaa">

    <p>{{name}}</p>

    <div ng-controller="Bbb">

        <p>{{name}}</p>

        <p>{{age}}</p>

    </div>

</div>

</body>

</html>
<!DOCTYPE HTML>

<html ng-app>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>angular概述</title>

<script src="angular.min.js"></script>

<script>

function Aaa($scope,$rootScope){  //加上$rootScope这个可以是age显示出来，相当于是全局的

    $scope.name = 'hello';

    $scope.age = '40';

    //$rootScope.age = '20';            这个是最终的，如果Bbb下没有这个age，Aaa下也没有的话，那么age就等于这个值，如果这个全局的也没有，那么这个age就真的没有了

}

function Bbb($scope){

    $scope.name = 'hi';

    $scope.age = '30';        //这里也添加一个这个的属性，下面结果是30

}

</script>

</head>

<body>

<div ng-controller="Aaa">

    <p>{{name}}</p>

    <div ng-controller="Bbb">

        <p>{{name}}</p>

        <p>{{age}}</p>

    </div>

</div>

</body>

</html>

二、依赖注入

<!DOCTYPE HTML>

<html ng-app>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<script src="angular.min.js"></script>

<script>

    function Aaa($scope,$rootScope){      //这里面的参数必须是这样，不能被修改，这就是依赖注入

        alert(123);

    }

</script>

</head>

<body>

    <div ng-controller="Aaa">

    </div>

</body>

</html>

angularJs的作用域和依赖注入的更多相关文章

  1. AngularJS API之$injector ---- 依赖注入

    在AngularJS中也有依赖注入的概念,像spring中的依赖注入,但是又有所不同.Spring中使用构造注入或者设值注入的方式,还需要做一些额外的操作,但是angular中只需要在需要的地方声明一 ...

  2. AngularJS学习笔记之依赖注入

    最近在看AngularJS权威指南,由于各种各样的原因(主要是因为我没有money,好讨厌的有木有......),于是我选择了网上下载电子版的(因为它不要钱,哈哈...),字体也蛮清晰的,总体效果还不 ...

  3. $scope作用域与依赖注入

    一.$scope与$rootscope作用域 $scope下的数据作为该控制器下的数据moduel,只有在该控制器下才能够访问:而$rootScope则可以可以再任何有效的地方访问到,这个有效的地方指 ...

  4. spring总结之二（Bean作用域、依赖注入）

    ### Bean的作用域:单例(singleton),多例(prototype) 1.单例模式:表示在任何地方使用对象,总是一个(对象是唯一的). (笔面试重点) 饿汉式 public class K ...

  5. AngularJS——第7章 依赖注入

    第7章 依赖注入 AngularJS采用模块化的方式组织代码,将一些通用逻辑封装成一个对象或函数,实现最大程度的复用,这导致了使用者和被使用者之间存在依赖关系. 所谓依赖注入是指在运行时自动查找依赖关 ...

  6. angularjs(显示和隐身) 依赖注入

    1.angularjs 隐身参数注入control: 1.control名称 , 2.function,在function内部直接传递参数和方法. var myapp=angular.model(&q ...

  7. 4.了解AngularJS模块和依赖注入

    1.模块和依赖注入概述 1.了解模块 AngularJS模块是一种容器,把代码隔离并组织成简洁,整齐,可复用的块. 模块本身不提供直接的功能:包含其他提供功能的对象的实例:控制器,过滤器,服务,动画 ...

  8. AngularJS学习--- AngularJS中XHR(AJAX)和依赖注入(DI) step5

    前言:本文接前一篇文章,主要介绍什么是XHR,AJAX,DI,angularjs中如何使用XHR和DI. 1.切换工具目录 git checkout -f step- #切换分支 npm start ...

  9. （五）Angularjs - 依赖注入

    如何找到API? AngularJS提供了一些功能的封装,但是当你试图通过全局对象angular去 访问这些功能时,却发现与以往遇到的库大不相同. 比如,AngularJS暴露了一个全局对象:angu ...

随机推荐

  1. BeanPostProcessor接口

    BeanPostProcessor接口及回调方法图 1.InstantiationAwareBeanPostProcessor:实例化Bean后置处理器(继承BeanPostProcessor) po ...

  2. 如何将本地文件通过终端上传到linux服务器或从linux主机下载文件到本地

    第一种方式: SecureCRT下上传文件只需在shell终端仿真器中输入命令“rz”,即可从弹出的对话框中选择本地磁盘上的文件,利用Zmodem上传到服务器当前路径下.下载文件只需在shell终端仿 ...

  3. 第8章 scrapy进阶开发(1)

    8-1 selenium动态网页请求与模拟登录知乎 Ⅰ.介绍selenium 1.什么是selenium:selenium百度百科 2.selenium的构架图: 如果要操作浏览器,还需要一个driv ...

  4. IO实战-RandomAccessFile在本地实现伪断点续传

    准备:在磁盘中 准备一个目录文件 实现:将该文件复制到目标路径中,关掉程序,再重新打开可以在原位置继续复制. 需求如下: 过程中显示文件的拷贝的百分比 复制过程中关掉程序. 重新启动该程序时,若上次没 ...

  5. Java实现类似类似百度搜索模糊关键字

    package com.test; import java.util.ArrayList; import java.util.HashMap; import java.util.LinkedHashM ...

  6. 使用admin lte 碰到访问Google字体的问题

    下载了admin lte 的模板,运行的时候,发现很慢,看了一下console,发现adminlte.css里有import google的字体文件,众所周知的原因,无法访问,所以网页很慢,没办法,只 ...

  7. BZOJ4659：lcm

    传送门 题目所给的不合法的条件可以转化为 \[\exists p,p^2|gcd(a,b) \Leftrightarrow \mu(gcd(a,b))\ne 0\] 那么 \[ans=\sum_{a= ...

  8. angular排序

    说点小案例angular的排序 <!DOCTYPE html> <html ng-app="mk"> <head> <meta chars ...

  9. Spring Data MongoDB 基础查询

    有两种方式查询 BasicQuery 和 Query 一.BasicQuery BasicQuery query = new BasicQuery("{ age : { $lt : 26 } ...

  10. LeetCode赛题390----Elimination Game

    # 390. Elimination Game There is a list of sorted integers from 1 to n. Starting from left to right, ...