html与js的取值，赋值
-------------------------------------------------- -------------------------------------------------- -------
html事件中传值： <button ng-click="showColor('green')">变色</button>
js中取值：
$scope.showColor=function($routeParams){
alert($routeParams)
}
-------------------------------------------------- -------------------------------------------------- -------
html中赋值：<a href="#/detail/{{ book }}"> book={{ book }}<br/>
js中取值：$routeParams. book
book为属性名
-------------------------------------------------- -------------------------------------------------- --------------------------------------
浏览器中赋值：
http://localhost:8080/test/index.html# /hello
app.js中取值
var app =angular.module('bookStoreApp',[
'bookStroreCtrls'
]);
app.config(function($routeProvider){
$routeProvider.when('/hello',{
templateUrl:'html/hello.html',
controller :'HelloCtrl'
})
.when('/ hello ',{
templateUrl:'html/form/testFormCtrl.html',--------跳转到对应的html页面
controller:'TestFormCtrl'--- ------寻找对应的controller
})
.when('/list',{
templateUrl:'html/bookList.html',
controller:'BookListCtrl'
})
.when('/detail/:book',{
templateUrl:'html/detail.html',
controller:'BookDetailCtrl'
})
.otherwise({
redirectTo:'/hello'
})
});
-------------------------------------------------- -------------------------------------------------- -------
Js中赋值：
/ng-bind在index.html首页的时候代替{{}}取值，在其他页面均用{{}}取值即可
1简单的赋值
$scope.hello="你好";
2 外层.内层赋值
$scope.hello={
someText:'演示特性二：演示模块化'
};
3 集合的赋值
$scope.books=[
{title:"书1",author:"作者1"},
{title:"书2",author:"作者2"},
{title:"书3",author:"作者3"}
]
$scope.names=['zhangsan','lisi','wangwu'];
html中取值：
1简单的取值{{hello}}输出"你好"
2外层.内层取值{{hello.someText}}输出“演示特性二：演示模块化”
3 集合取值
<div ng-controller="listCtrol">
<table>
<tr ng-repeat='name0 in names' >
<td >{{id}}-{{name}}—{{name0}}-{{department} } from {{names}}</td>
</tr><br/>
</table>
</div>
<ul>
<!--此处标签内放两个ng-repeat不会报错，只是起作用而已。当两个同时出现时，标签只认第一个-->
<li ng-repeat="book in books" ng-repeat="name in names" >
<a href="#/detail/{{ book } }"> book={{ book }}<br/>
title={{book.title}}<br/>
author={{book.author}}<br/>
names={{names}}<br/ >
name={{name}}<!--此处无法显示-->
</a>
</li>
隐藏与显示的时候，我们要注意，赋值是不变的，取值是不需要加{{}}的
//列表默认隐藏
js:$scope.visible = true;
html:<div ng-hide="visible"></div>
html赋值：
1{{ }}==== 除index.html之外，其他页面均可以使用这样的赋值方法
<div>{{name}}</div>
{{ }}语法是AngularJS内置的模板语法，它会在内部$scope和视图之间创建绑定。基于这个
绑定，只要$scope发生变化，视图就会随之自动更新。
事实上它也是指令，虽然看起来并不像，实际上它是ng-bind的简略形式，用这种形式不需
要创建新的元素，因此它常被用在行内文本中。
注意，在屏幕可视的区域内使用{{ }}会导致页面加载时未渲染的元素发生闪烁，用ng-bind
可以避免这个问题。
<body ng-init="greeting='HelloWorld'">
{{ greeting }}
</body>
在线示例：http://jsbin.com/ODUxeho/1/edit。
2 ng-bind==index.html中一般使用这个，不用{{}}
尽管可以在视图中使用{{ }}模板语法（AngularJS内置的方式），我们也可以通过ng-bind
指令实现同样的行为。
<body ng-init="greeting='HelloWorld'">
<p ng-bind="greeting"></p>
</body>
在线示例：http://jsbin.com/esihUJ/1/edit。
HTML加载含有{{ }}语法的元素后并不会立刻渲染它们，导致未渲染内容闪烁（Flash of
Unrendered Content，FOUC）。我可以用ng-bind将内容同元素绑定在一起避免FOUC。内容会被
当作子文本节点渲染到含有ng-bind指令的元素内。
3 ng-cloak index.html中也可以使用这样的方法
除使用ng-bind来避免未渲染元素闪烁，还可以在含有{{ }}的元素上使用ng-cloak指令：
<body ng-init=" greeting='HelloWorld'">
<p ng-cloak>{{ greeting }}</p>
</body>
ng-cloak指令会将内部元素隐藏，直到路由调用对应的页面时才显示出来。
以上为赋值单个， 以下为赋值多个
ng-bind-template
同ng-bind指令类似，ng-bind-template用来在视图中绑定多个表达式。
<div
ng-bind-template="{{message}}{{name}}">
</div>
html与js的取值，赋值的更多相关文章
- js表单快速取值/赋值 快速生成下拉框
1.表单取值/赋值公共方法 //表单序列化:文本框的name字段和数据源一致<form id="myForm" onsubmit="return false;&qu ...
- Data层相关问题 & JS循环取值
第一次写博客,里面是自己工作中碰到的问题及总结的知识点,便于自己以后回顾,技术大牛们请直接忽略这篇文章,也希望能帮助到想我这样的小白! Data层相关问题总结: 1. 代码管理用的是 VSS 2005 ...
- JQuery关于span标签的取值赋值
span取值赋值方法有别于一般的页面元素.JQ://赋值$("#spanid").html("hello world") //取值$("#spanid ...
- Jquery 关于span标签的取值赋值用法
span是最简单的容器,可以当作一个形式标签,其取值赋值方法有别于一般的页面元素. //赋值 $("#spanid").html(value) //取值 $("#span ...
- Jquery操作下拉框(DropDownList)实现取值赋值
Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...
- Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢)
Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢) 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val() ...
- winform 批量控件取值赋值
以前写winform 最多写几个文本框,最近需要入录一个人员信息,那好几十个字段,一下子干蒙了,这要是一个个取值赋值都写到明天了,于是就自己写了个方法,也不是什么高大上的,就是很简单很普通很low的方 ...
- Dynamics 365-表单元素取值/赋值
取值/赋值 参考: 山人丶 提示: 查找类型赋值时需指定目标实体,记录名称及id值 时间和日期类型赋值时需赋值Date类型 //获取new_name的值(单行文本) Xrm.Page.getAttri ...
- [King.yue]Ext.JS 弹出窗体取值赋值
//从Grid取值 var name = Ext.getCmp(gridGridID).getView().getSelectionModel().getSelection()[0].data.Nam ...
随机推荐
- 注解Annotation 详解（转）
要深入学习注解,我们就必须能定义自己的注解,并使用注解,在定义自己的注解之前,我们就必须要了解Java为我们提供的元注解和相关定义注解的语法. 元注解: 元注解的作用就是负责注解其他注解.Java5. ...
- Hashing Trick
本博客已经迁往http://www.kemaswill.com/, 博客园这边也会继续更新, 欢迎关注~ 在机器学习领域, kernel trick是一种非常有效的比较两个样本(对象)的方法. 给定两 ...
- linux 系统运维
Linux 系统监控1.进程 查看所有进程 ps -ef ps -ef |grep nginx 结束进程 # 结束进程号为5031 kill -g 5031 # 结束 ...
- Sphinx(coreseek) 安装使用以及词库的扩展
1.Sphinx(coreseek) 是啥 一般而言,Sphinx是一个独立的全文搜索引擎:而Coreseek是一个支持中文的全文搜索引擎,意图为其他应用提供高速.低空间占用.高结果相关度的中文全文搜 ...
- [原]如何在Android用FFmpeg+SDL2.0解码显示图像
如何在Android上使用FFmpeg解码图像参考文章[原]如何在Android用FFmpeg解码图像 ,如何在Android上使用SDL2.0来显示图像参考[原]零基础学习SDL开发之在Androi ...
- c++ 全局变量初始化的一点总结
注意:本文所说的全局变量指的是 variables with static storage,措词来自 c++ 的语言标准文档. 什么时候初始化 根据 C++ 标准,全局变量的初始化要在 main 函数 ...
- Android UI开发第四十篇——ScrollTricks介绍
ScrollTricks是一个开源控件,实现了两个简单功能: 1.Quick Return:向上滑动时,View也向上滑动并且消失,当向下滑动时,View马上出现.例如Google Now的搜索功能. ...
- 在C函数中保存状态：registry、reference和upvalues
C函数可以通过堆栈来和Lua交换数据,但有时候C函数需要在函数体的作用域之外保存某些Lua数据,那么我们想到全局变量或static变量,这样做的缺点是:(1)为Lua设计C函数库时,导致不可重入:(2 ...
- Lua中的协同程序 coroutine
Lua中的协程和多线程很相似,每一个协程有自己的堆栈,自己的局部变量,可以通过yield-resume实现在协程间的切换.不同之处是:Lua协程是非抢占式的多线程,必须手动在不同的协程间切换,且同一时 ...
- 2次成功投诉EMS和中国移动的经验
上个月要找房子,搬家很多事情,真实头疼...搬家还把腰闪了....现在还有点痛.然后中间碰到 移动宽带 移机的事情,搞得我非常火.然后想起去年投诉EMS的事情,在事情处理完成后,我果断总结了下来,让大 ...