AngularJS Scope(作用域)

Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。

Scope 是一个对象,有可用的方法和属性。

Scope 可应用在视图和控制器上

当你在 AngularJS 创建控制器时,你可以将 $scope 对象当作一个参数传递

视图中,你不需要添加 $scope 前缀, 只需要添加属性名即可

scope 是模型。

scope 是一个 JavaScript 对象,带有属性和方法,这些属性和方法可以在视图和控制器中使用。

所有的应用都有一个 $rootScope,它可以作用在 ng-app 指令包含的所有 HTML 元素中。

$rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值,可以在各个 controller 中使用。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="angular-1.6.3/angular.js"></script>
</head>
<body>
<div ng-app="myDirective" ng-controller="myController">
名字:<input ng-model="name">
<h1>你输入的名字:{{name}}</h1>
<p>{{lastName}}</p>
</div>
<script>
var app=angular.module("myDirective",[]);
app.controller("myController", function($scope,$rootScope) {//注意参数名称
$scope.name="chenyunfei";
$rootScope.lastName="fei";
});
</script>
</body>
</html>

AngularJS学习篇(五)的更多相关文章

  1. angularjs学习第五天笔记(第二篇:表单验证升级篇)

    您好,我是一名后端开发工程师,由于工作需要,现在系统的从0开始学习前端js框架之angular,每天把学习的一些心得分享出来,如果有什么说的不对的地方,请多多指正,多多包涵我这个前端菜鸟,欢迎大家的点 ...

  2. AngularJS学习篇(十五)

    AngularJS 模块 模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 创建模块 你可以通过 AngularJS 的 angular. ...

  3. AngularJS学习篇(二十四)

    AngularJS 应用 <html ng-app="myNoteApp"> <head> <meta charset="utf-8&quo ...

  4. AngularJS学习篇(二十三)

    AngularJS 路由 AngularJS 路由允许我们通过不同的 URL 访问不同的内容. 通过 AngularJS 可以实现多视图的单页Web应用(single page web applica ...

  5. AngularJS学习篇(二十二)

    AngularJS 依赖注入 什么是依赖注入 wiki 上的解释是:依赖注入(Dependency Injection,简称DI)是一种软件设计模式,在这种模式下,一个或更多的依赖(或服务)被注入(或 ...

  6. AngularJS学习篇(二十一)

    AngularJS 动画 AngularJS 提供了动画效果,可以配合 CSS 使用. AngularJS 使用动画需要引入 angular-animate.min.js 库. <!doctyp ...

  7. AngularJS学习篇(二十)

    AngularJS 包含 在 AngularJS 中,你可以在 HTML 中包含 HTML 文件. 使用 AngularJS, 你可以使用 ng-include 指令来包含 HTML 内容: < ...

  8. AngularJS学习篇(十九)

    AngularJS Bootstrap 可以在你的 AngularJS 应用中加入 Twitter Bootstrap,你可以在你的 <head>元素中添加如下代码: <link r ...

  9. AngularJS学习篇(十八)

    AngularJS API AngularJS 全局 API 用于执行常见任务的 JavaScript 函数集合,如: 比较对象 迭代对象 转换对象 全局 API 函数使用 angular 对象进行访 ...

随机推荐

  1. Spring 学习——基于Spring WebSocket 和STOMP实现简单的聊天功能

    本篇主要讲解如何使用Spring websocket 和STOMP搭建一个简单的聊天功能项目,里面使用到的技术,如websocket和STOMP等会简单介绍,不会太深,如果对相关介绍不是很了解的,请自 ...

  2. Vue.js的从入门到放弃进击录(二)

    哇塞,昨晚更新的篇(一)这么多阅读量,看来入坑的人越来越多啦~熬了一个礼拜夜,今天终于生病惹~国庆要肥家咯·所以把篇(二)也更完.希望各位入坑的小伙伴能少跳几个坑呗.如果有什么不对的地方也欢迎讨论指正 ...

  3. 快速双边滤波 附完整C代码

    很早之前写过<双边滤波算法的简易实现bilateralFilter>. 当时学习参考的代码来自cuda的样例. 相关代码可以参阅: https://github.com/johng12/c ...

  4. hdu 1542 线段树 求矩形并

    Atlantis Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Su ...

  5. Ubuntu 定时任务中的环境变量设置

    背景 1,定时任务命令 crontab -e 2,默认的环境变量 SHELL=/bin/sh PATH=/usr/bin:/bin PWD=/home/owl LANG=zh_CN.UTF- SHLV ...

  6. ocs的沟通平台

    Microsoft Office Communications Server 2007 R2 简称:OCS准时准确地联系人员以及管理信息过载根据人员的状态与其联系,然后单击最佳方式与其通信:通过电子邮 ...

  7. Druid源码阅读之连接池

    概述 Druid是阿里巴巴开源的一个数据库连接池 源码地址.下面简单分析一下连接池是怎么实现的 怎么开始阅读 如果使用过Druid连接池的都只要在Spring配置中配置jdbc的时候配置Driver是 ...

  8. 将图标LOGO之类的图形图像转换成字体调用方法大全

    借鉴百度对此标题的评价: 使用字体图标的优势 字体图标除了图像清晰度之外,比位图还有哪些优势呢. 适用性:一个图标字体比一系列的图像(特别是在Retina屏中使用双倍大小的图像)要小.一旦图标字体加载 ...

  9. Java IO编程全解(一)——Java的I/O演进之路

    转载请注明出处:http://www.cnblogs.com/Joanna-Yan/p/7419117.html JDK1.4之前的早期版本,Java对I/O的支持并不完善,开发人员在开发高性能I/O ...

  10. Extjs6(四)——侧边栏导航根据路由跳转页面

    本文基于ext-6.0.0 之前做的时候这个侧边栏导航是通过tab切换来切换页面的,但是总感觉不太对劲,现在终于发现怎么通过路由跳转了,分享给大家,可能有些不完善的地方,望大家读后可以给些指点.欢迎留 ...