angular js 实例参数学习
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="[add your bin description]">
<meta charset="utf-8">
<title>JS Bin</title>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.0-beta.4/angular.min.js"></script>
<script>
//directive文件directives.js中定义一个myTest
//定义一个模块 angular.module('myApp',[]), 获取一个模块 angular.module('myApp')
var phonecatDirectives = angular.module('phonecatDirectives', []);
//定义一个指令
phonecatDirectives.directive('myTest', function() {
return {
restrict: 'ACEM',
require: '^ngModel',
scope: {
ngModel: '=' //变量 数据绑定
},
template: '<div><h4>Weather for {{ngModel}}</h4></div>'
}
});
//controller文件controller.js中定义directive1 定义控制器
var dtControllers = angular.module('dtControllers', []);
dtControllers.controller('directive1',['$scope',
function($scope) {
$scope.name = 'this is tank test';
}
]);
//在app文件app.js中整合controller,directive 模块
var phonecatApp = angular.module('phonecatApp', [
'phonecatDirectives',
'dtControllers'
]);
</script>
</head>
<body ng-app="phonecatApp">
<div ng-controller="directive1">
<input type="text" ng-model="city" placeholder="Enter a city" />
<my-test ng-model="city" ></my-test>
<span my-test="exp" ng-model="city"></span>
<!-- directive: my-test exp -->
<span ng-model="city"></span>
</div>
</body>
</html>
angular js 实例参数学习的更多相关文章
- 关于Angular.js Routing 的学习笔记(实现单页应用)
最近开始学习angular.js,发现angular.js确实很方便,也很强大.在看到 AngularJS Routing and Multiple Views 这一部分的时候,有点乱.现在通过记录一 ...
- Angular.js 以及个人学习网站
Angular.js 教程 http://www.360doc.com/content/14/0414/15/14416931_368816305.shtml web前端学习: 慕课网:http:/ ...
- Angular.js之Router学习笔记
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- Angular.js之指令学习笔记
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...
- 史上最全的Angular.js 的学习资源
Angular.js 的一些学习资源 基础 官方: http://docs.angularjs.org angularjs官方网站已被墙,可看 http://www.ngnice.com/: 官方zi ...
- Angular JS 学习之路由
1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...
- 学习angular.js的一些笔记想法(上)
1.data-ng-app与ng-app的区别 data-ng-app是为了h5不报错 2.ng-class 不多说就来拿例子说吧 html代码 <div class='color-change ...
- Angular.js学习笔记（三）
一.过滤器 1.uppercase,lowercase 大小写转换{{ "lower cap string" | uppercase }} // 结果:LOWER CAP STRI ...
- angular.js学习的第一天
第一天对angular.js进行学习,肯定是面对的入门的最简单的实例: 实现下面的这个效果,首先需要在html页面引入angular.js,在下面的div中,ng-app则表示在当前div是一个ang ...
随机推荐
- CSS滤镜详解
语法:STYLE="filter:filtername(fparameter1, fparameter2...)" (Filtername为滤镜的名称,fparameter1.fp ...
- 【POJ】【2151】Check the difficulty of problems
概率DP kuangbin总结中的第8题 一开始题目看错导致想转移方程想错了……想成f[i][j]表示前 i 个队伍中最多的做出来 j 道题的概率……sigh 看了下题解……其实是对于每个队伍 i 单 ...
- Java多线程——<五>后台线程(daemon)
一.后台线程(守护线程) 学一个东西,最重要的一点就是,为什么要用它? 后台线程区别于普通线程,普通线程又可以称为用户线程,只完成用户自己想要完成的任务,不提供公共服务.而有时,我们希望编写一段程序, ...
- C++字符串分割
//字符串分割函数 std::vector<std::string> split(std::string str,std::string pattern) { std::string::s ...
- Eclipse下PHP开发 插件安装
PHPeclipse是什么? PHPeclipse是Eclipse的一个插件,它为php开发人员提供了一个集成的开发环境.Eclipse官方下载地址:http://www.eclipse.org/ P ...
- c#中HttpWebRequest使用Proxy实现指定IP的域名请求
原文:http://www.cnblogs.com/greenerycn/archive/2010/04/11/httpwebreques_host_modify_By_set_proxy.html ...
- 关联式容器（associative containers）
关联式容器(associative containers) 根据数据在容器中的排列特性,容器可分为序列式(sequence)和关联式(associative)两种. 标准的STL关联式容器分为set( ...
- sql中时间的比较方法
--------------------------------------------------------------------1. 当前系统日期.时间select getdate() 2. ...
- POJ2996Help Me with the Game
http://poj.org/problem?id=2996 又是一个大模拟题,表示做模拟题做的恶心,这个题主要是对数据的处理,从表格中将数据取出来再进行处理即可. 主要注意的点就是:1.KQRBN五 ...
- Ubuntu环境下手动配置ElasticSearch0.90.5
1 下载elasticsearch-0.90.5 2 修改配置(可选) 修改内存:(可选) bin/elasticsearch.in.sh中: ES_MIN_MEM ES_MAX_MEM 修改搜索引擎 ...