angularJS笔记
1、MVC
ng-app: html表头处,每个htnl文件只能有一个ng-app
ng-controller :js文件中定义
ng-model:只要引用了angularJS就可以使用
js文件代码如下:
var myMoudle = angular.module("HelloAngular",[]);
myMoudle.controller("HelloAngular",['$scope', //控制器 C
function HelloAngular($scope){
$scope.greeting = {
text: "Hello"
}
}
])
myMoudle.directive("hello",function(){ //重定义前端 V
return{
restrict : 'E',
template: '<div>Hi everyone!',
replace: true
}
});
html文件代码如下:
<!doctype html>
<html ng-app = "HelloAngular">
<head>
<meta charset = "utf-8">
</head>
<body>
<div ng-controller = "HelloAngular">
<p>{{greeting.text}},Angular</p>
<p>{{greeting.text}},Angular</p>
<hello></hello>
</div>
<div>
<input ng-model = "greeting.text"/> <!--model M-->
<p>{{greeting.text}},Angular</p>
</div>
</body> <script src = "../../node_modules/angular/angular.js"></script>
<script src = "Hello_Angular_Module.js"></script> </html>
ng-repeat : 内敛使用
ng-click: 点击事件
<li ng-repeat = "i in [1,2,4,3]" ng-controller = "xxx">{{i}}
神奇的$scope
1、$scope是一个POJO(js对象)
2、$scope提供了一些工具方法($watch()\$applay())
3、$scope是一个树形结构,与DOM标签平行
4、子$scope对象会继承父$scope上的属性和方法
4、每个angularjs会有一个根$scope,一般位于(ng-app)
angularjs启动时首先查找ng-app,然后查找$rootscope
angularJS笔记的更多相关文章
- AngularJS笔记---注册服务
在前面的笔记中,了解到AngularJS的后台控制可以在Controller里面实现. 可是如果所有的逻辑代码都写到Controller会显得该Controller过于臃肿. 不方便维护, Angul ...
- AngularJs 笔记
初识 directive 指令 ng-app 初始化一个AngularJs应用程序(通过一个值(比如 ng-app="myModule")连接到代码模块.) ng-init 初始化 ...
- AngularJS笔记--自定义指令
在前端开发中, 我们会遇到很多地方都会用到同一种类型的控件.AngularJS提供了自定义指令功能,我们可以在指令里面定义特定的html模板.提供给前台html调用. 一. 指令的简单定义. 下面定 ...
- AngularJS笔记---路由视图
最近有同事提到过关于ng-view的使用, 其实自己也不懂了,由于最近一直在做AngularJs的Rearch,所以就看了一些关于ng-view的国外博客. 做过ASP.NET MVC4的都知道, 我 ...
- AngularJS笔记---作用域和控制器
什么是作用域. 什么是控制器, 作用域包含了渲染视图时所需的功能和数据,它是所有视图的唯一源头.可以将作用域理解成试图模型(ViewModel). 作用域之间可以是包含关系也可以是独立关系.可以通过设 ...
- angularjs 笔记(1) -- 引导
首先: 1,引入angularJS文件,<script type="text/javascript" src="angularjs.min.js"> ...
- AngularJS笔记---数据绑定
一.数据绑定 1.简单绑定 下面实现了一个简单的加法运算的绑定, A.ng-app:表示该div以内都在AngularJS的应用, 去掉ng-app="" 那么后面的绑定都将无效 ...
- angularjs笔记(三)
AngularJS API 7.其他一些常用指令,布尔类型的指令也可以用表达式 (1).数组索引$index <!DOCTYPE html> <html> <head&g ...
- angularjs笔记(二)
AngularJS API 4.AngularJS过滤器 使用一个管道符(|)添加到表达式和指令中 例1.格式化字母转为大写 <!DOCTYPE html> <html> &l ...
- angularjs笔记(一)
简介 AngularJS API angularjs是javascript框架,通过指令(指令就是自定义的html标签属性)扩展了HTML,并且可以通过表达式(表达式使用)绑定数据到HTML. 1.a ...
随机推荐
- SVN 目录结构
Subversion有一个很标准的目录结构,是这样的.比如项目是proj,svn地址为svn://proj/,那么标准的svn布局是 svn://proj/|+-trunk+-branches+-ta ...
- Quartz 并发/单线程
Quartz 并发/单线程 Quartz定时任务默认都是并发执行的,不会等待上一次任务执行完毕,只要间隔时间到就会执行, 如果定时任执行太长,会长时间占用资源,导致其它任务堵塞.1.在Spring中这 ...
- player/stage 学习---安装
环境 ubuntu 14.04 一,工具安装 sudo apt-get install git cmake g++ fltk1.1-dev libjpeg8-dev libpng12-dev libg ...
- Spring中的mappingResources和mappingDirectoryLocations
今天使用Spring+Hibernate进行事务管理,按照顺序也就是配置,DataSource,Sessionfactory,事务管理器以及拦截器. DateSource可以直接使用Hibernate ...
- maven小项目注册服务(一)--email和persist模块
跟着书里的讲解,跟着做了一遍该项目: 首先明白注册账户的需求: 账号的lD和Email地址都可以用来唯一地标识某个用户,而显示名称则用来显示在页面下,方便浏览.注册的时候用户还需要输入两次密码,以确保 ...
- MyEclipse 常用设置
1.指定本机java环境 Windows-->preferences-->java-->Insetallel JREs 右侧 单击ADD-->standard VM--> ...
- Spring学习8-Spring事务管理
http://blog.sina.com.cn/s/blog_7ffb8dd501014e0f.html Spring学习8-Spring事务管理(注解式声明事务管理) 标签: spring注 ...
- sdut 2934 人活着系列之平方数 (完全背包变形)
题目链接 分析:完全背包的变形,每一层的d[]数组代表这一层的这个数新加入以后所构成的val的种类. #include <iostream> #include <cstdio> ...
- Android软件开发需要学什么
首先,需要学习哪些Android开发技术? Android的开发技术很多,在开始学习的时候不可能一次性全部学会,也没有必要一开始都全部学会,但是有些技术是非常常用的,需要在开始时打好基础,这些技术时: ...
- webapp调试工具weinre的使用
在设计师与前端开发人员的努力下,一个WebApp出炉了,可是测试人员说了一堆的问题:某某机型下页面表现不一致,某某系统下页面如何如何,某某 系统浏览器下页面怎么怎么滴.看着满满的测试汇总文档,我们曾经 ...