[angularjs] angularjs系列笔记（一）简介
Angularjs通过新的属性和表达式扩展了html
Andularjs 可以构建一个单一页面的应用程序（SPAS SinglePageApplications）
Angularjs通过指令扩展了html，通过表达式绑定数据到html
ng-app指令定义Angularjs的应用程序
ng-model指令绑定元素值到应用程序
ng-bind指令把应用程序数据绑定到html视图
<div ng-app="">
<input type="text" ng-model="name">
<p ng-bind="name"></p>
</div>
AngularJs的指令是以ng作为前缀的html属性
ng-init指令初始化AngularJs应用程序的变量
AngularJs的表达式写在双大括号内：{{表达式}}
AngularJs的表达式把数据绑定到html，这与ng-bind指令有异曲同工之妙
AngularJs将在表达式输出的定义的位置输出数据
<div ng-app="" ng-init="myName='taoshihan'">
<input type="text" ng-model="name">
<p ng-bind="name"></p>
<p ng-bind="myName"></p>
<p>{{5+5}}</p>
</div>
AngularJs模块（Module）定义了AngularJs应用
AngularJs控制器（Controller）用于控制AngularJs应用
ng-app指令定义了应用，ng-controller指令定义了控制器
<body>
<div ng-app="Home" ng-controller="index">
<p>{{myName}}</p>
</div>
</body>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script type="text/javascript">
//实例化应用对象，参数：模块名，空数组
var app=angular.module("Home",[]);
//调用应用对象的controller()方法，参数：控制器名，回调函数
app.controller("index",function($scope){
$scope.myName="taoshihan";
})
</script>
[angularjs] angularjs系列笔记（一）简介的更多相关文章
- angularjs自动化测试系列之jasmine
angularjs自动化测试系列之jasmine jasmine参考 html <!DOCTYPE html> <html lang="en"> <h ...
- angularjs自动化测试系列之karma
angularjs自动化测试系列之karma karma test with jasmine 更好的利用工具是为了让生活更美好. 需要安装的东西: npm install karma -g mkdir ...
- AngularJS路由系列(6)-- UI-Router的嵌套State
本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...
- AngularJS路由系列(5)-- UI-Router的路由约束、Resolve属性、路由附加数据、路由进入退出事件
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router约束路由参数● UI-Router的Resolve属性● UI-Router给路由附加数据● UI- ...
- AngularJS路由系列(4)-- UI-Router的$state服务、路由事件、获取路由参数
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router的$state服务● UI-Router的路由事件● UI-Router获取路由参数 Angular ...
- AngularJS路由系列(3)-- UI-Router初体验
本系列探寻AngularJS的路由机制,在WebStorm下开发. AngularJS路由系列包括: 1.AngularJS路由系列(1)--基本路由配置2.AngularJS路由系列(2)--刷新. ...
- AngularJS路由系列(2)--刷新、查看路由,路由事件和URL格式，获取路由参数，路由的Resolve
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 刷新路由● 查看当前路由以及所有路由● 路由触发事件● 获取路由参数 ● 路由的resolve属性● 路由URL格式 ...
- AngularJS路由系列(1)--基本路由配置
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 路由的Big Picture ● $routeProvider配置路由 ● 使用template属性 ● 使用temp ...
- 跟我学AngularJs:AngularJs入门及第一个实例
林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 摘要:主要给大家介绍了AngularJs及其特性,并以3个实例来做说明. 本教程使用Angul ...
- Vim 系列笔记一
Vim 系列笔记一 Vim 简介 什么是VIM ? Vim 是从 Vi 发展出来的一个编辑器,是 Vi 的升级版.而 vi 则是 Unix .类Unix(Linux)系统中自带的编辑器. Vim/Vi ...
随机推荐
- HDFS JAVA客户端的权限错误：Permission denied
HDFS JAVA客户端的权限错误:Permission denied 转自:http://blog.csdn.net/kkdelta/article/details/50393413 搭建了一个Ha ...
- TCP/IP（八）之总结TCP/IP四层模型
阅读目录(Content) 一.TCP/IP参考模型概述 1.1.TCP/IP参考模型的层次结构 二.TCP/IP四层功能概述 2.1.主机到网络层 2.2.网络互连层 2.3.传输层 2.3.应用层 ...
- Nuget4.0 bug一粒
这个锅到底是nuget的还是msbuild的我也不是很确定 在使用Nuget4.0打包编译项目时 当执行到nuget pack %%~dpna.csproj -build -Prop Configur ...
- 像纸质笔记本一样给div,textarea添加行的分割线
想要给textarea添加一个背景图来实现 但是背景图有几个问题, 1.每个div或者textarea的line-height不一样,对于每个不同的line-height都需要一个不同的背景图 2.当 ...
- 【红色警报】XXE 高危漏洞将大面积影响微信支付安全，可能导致系统沦陷，请升级你的系统！
今天,微信支付发布了一则紧急通知: 尊敬的微信支付商户: 您的系统在接受微信支付XML格式的商户回调通知(支付成功通知.退款成功通知.委托代扣签约/解约/扣款通知.车主解约通知)时,如未正确地进行安全 ...
- Oracle实战笔记（第一天）
导读 笔记内容来自韩顺平老师的视频<玩转Oracle实战教程>,可以结合笔记进行观看.第一天视频中还有Oracle的介绍和安装等内容,很容易搜索到,这里就不再进行总结. 目录 1.命令行工 ...
- 神经网络(BP)算法Python实现及简单应用
首先用Python实现简单地神经网络算法: import numpy as np # 定义tanh函数 def tanh(x): return np.tanh(x) # tanh函数的导数 def t ...
- 项目笔记：2018年4月（SpringCloud架构和SpringBoot框架）
一.启动Euerka服务 1.在启动类里用@propertySource引入全局配置文件noteapp-service.properties: 如上图.左侧为某服务配置文件properties,右侧为 ...
- 远程桌面连接：出现身份验证错误，要求的函数不受支持，可能是由于CredSSP加密Oracle修正的解决方法
在做app时需要连接服务器来进行数据交互,但是在阿里云页面里连接服务器太不好用,所以使用windows自带的远程连接来进行. 一.但是连接的过程中出现了以下问题: 二.最初是有点迷茫的,不知道从哪里下 ...
- webpack vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin
当我们出现以下报错! 解决方案: // webpack配置文件 const path = require('path'); const htmlWebpackPlugin = require('htm ...