Angular JS 学习之 Scope作用域
1.Scope作用域是应用在HTML(视图)和JavaScript(控制器)之间的纽带;
Scope是一个对象,有可用的方法和属性;
Scope可应用在视图和控制器上;
2.当你在AngularJS中创建控制器时,你可以将$scope对象作为一个参数传递;
<div ng-app="" ng-controller="myCtrl">
<h1>{{carname}}</h1>
</div>
<script>
var app=angular.module('myApp',[]);
app.controller('myCtrl',function($scope){
$scope.carname="Volvo"; //控制器中创建一个属性名 "carname",对应了视图中使用 {{ }} 中的名称。
});
</script>
3.Scope概述:
**AngularJS应用组成如下:
(1)View(视图),即HTML;
(2)Model(模型),当前视图中可用的数据;
(3)Controller(控制器),即JavaScript函数,可以添加或修改属性;
**scope是模型,是一个javaScript对象,带有属性和方法,这些属性和方法可以在视图中和控制器中使用;
4.Scope作用范围:
<div ng-app="" ng-controller="myCtrl">
<ul>
<li ng-repeat="x in name">{{x}}</li>
</ul>
</div>
<script>
var app=angular.module('myApp',[]);
app.controller('myCtrl',function($scope){
$scope.name=['Emil','Tobias','Linus'];
});
</script>
5.根作用域:所有的应用都有一个$rootScope,它可以作用在ng-app指令包含的所有HTML元素中;
$rootScope可作用于整个应用中,是各个controller中scope的桥梁,用rootscope定义的值,可以在各个controller中使用;
<div ng-app="' ng-controller="myCtrl">
<h1>{{lastname}}家族成员:</h1>
<ul>
<li ng-repeat="x in names">{{x}} {{lastname}}</li>
</ul>
</div>
<script>
var app=angular.module('myApp',[]);
app.controller('myCtrl',function($scope,$rootScope){
$scope.names=["Emil","Tobias","Linus"];
$rootscope.lastname="Refsnes";
});
</script>
Angular JS 学习之 Scope作用域的更多相关文章
- python , angular js 学习记录【1】
1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...
- 适合我胃口的angular.js学习资料
断断续续弄了半年的ANGULAR.JS学习资料,网上下载了N多资料,测试了很多次. 现在只能算是入门,因时间问题,现在要转入其它领域. 如果以后要拾起来,下面这个PDF比较对我胃口. <Angu ...
- angular.js学习笔记--概念总结
好久没更新了,现在开始学习学习angularjs,并且把学习到的一些知识总结记录一下,方便以后查找以及希望能给初学者一些帮助!(由于本人也是初学ng所以各位慎重理解!) 废话不多说,开始! $root ...
- Angular JS 学习之路由
1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...
- Angular JS 学习之Bootstrap
1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...
- Angular.JS学习笔记——1
内容来自:http://www.runoob.com/angularjs/angularjs-intro.html AngularJS 是一个 JavaScript 框架.它是一个以 JavaScri ...
- Angular JS 学习之简介
1.Angular JS是一个JavaScript框架,它是一个以JavaScript编写的库,它可以通过<script>标签添加到HTML页面: <script src=" ...
- Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)
刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...
- Angular.js 学习笔记
AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序. <!-- ng-app 指令定义一个 AngularJS 应用程序. ng-mod ...
随机推荐
- Match:Seek the Name, Seek the Fame(POJ 2752)
追名逐利 题目大意:给定一个字符串S,要你找到S的所有前缀后缀数组 还是Kmp的Next数组的简单应用,但是这一题有一个BUG,那就是必须输出字符串的长度(不输出就WA),然而事实上对于abcbab, ...
- bootstrap弹出提示窗口功能
大家常用弹出提示成功或失败时候喜欢用alert,如果不用这个,写个弹窗又麻烦,bootstrap中就有个方法 alert("操作成功"); commonAlert("操作 ...
- 在linux中,rpm和yum有什么区别?
rpm是由红帽公司开发的软件包管理方式,使用rpm我们可以方便的进行软件的安装.查询.卸载.升级等工作.但是rpm软件包之间的依赖性问题往往会很繁琐,尤其是软件由多个rpm包组成时.Yum(全称为 Y ...
- 20145206邹京儒《Java程序设计》第8周学习总结
20145206 <Java程序设计>第8周学习总结 教材学习内容总结 第十四章 NIO与NIO2 14.1 认识NIO NIO使用频道(Channel)来衔接数据节点,在处理数据时,NI ...
- IT人学习方法论(二):学习误区
之前我们讨论了“学什么”的问题,今天我们来谈一谈“怎么学”的问题.磨刀不误砍柴工,我们要提高学习效率,首先需要找到自己学习方法上的误区. 一些常见的学习方法误区 1)资料导向型 现在就停止阅读这篇文章 ...
- ListView + PopupWindow实现滑动删除
原文:ListView滑动删除 ,仿腾讯QQ(鸿洋_) 文章实现的功能是:在ListView的Item上从右向左滑时,出现删除按钮,点击删除按钮把Item删除. 看过文章后,感觉没有必要把dispat ...
- Dubbo应用与异常记录
结合项目里使用暴露出的问题,对并发较多的核心业务或者对请求失败等敏感的业务场景不太建议使用Dubbo, 如电商的购买等行为,使用Dubbo就必须阅读源码,熟悉相关机制,或者直接自己造轮子. >& ...
- AXURE在原型设计中的应用
转: http://uedc.163.com/2248.html 前言 什么是原型呢? 产品原型简单的说就是产品设计成形之前的一个简单框架,对网站来讲,就是将页面模块.元素进行粗放式的排版和布局,深入 ...
- 【C#】 用Route进行URL重写
在.NET Framework 4中,微软推出了Route机制.这种机制不仅在MVC中大量运用,在WebForm中也可以使用. 和Contex.RewritePath()一样,Route功能也是写在G ...
- Delphi中record和packed record的区别
转载:http://blog.csdn.net/rznice/article/details/6566978 第一种不带packed关键字的结构体表明编译器编译时要求进行字对齐. 而第二种带packe ...