指令:ng-bind
2016-04-05 18:15
323 查看
指令ng-bind和表达式{{}}有相同的展示效果,但是不同的是指令ng-bind是在angular解析渲染完毕之后再把数据显示出来。
如下使用ng-bind绑定数据:
PS:使用花括号语法时,因为浏览器需要首先加载页面,渲染它,然后AngularJS才能把它解析成你期望看到的内容,所以对于首个页面中的数据绑定操作,建议采用ng-bind,以避免其未被渲染的模板被用户看到。
如下使用ng-bind绑定数据:
<div ng-app=""> 请输入一个字:<input type="text" ng-model="name"/> <br> Hello <span ng-bind="name"></span>
PS:使用花括号语法时,因为浏览器需要首先加载页面,渲染它,然后AngularJS才能把它解析成你期望看到的内容,所以对于首个页面中的数据绑定操作,建议采用ng-bind,以避免其未被渲染的模板被用户看到。
相关文章推荐
- angular.element方法汇总
- 深入学习JavaScript的AngularJS框架中指令的使用方法
- Angular用来控制元素的展示与否的原生指令介绍
- 使用angular写一个hello world
- vue,angular,avalon这三种MVVM框架优缺点
- 使用Angular和Nodejs、socket.io搭建聊天室及多人聊天室
- AngularJS页面访问时出现页面闪烁问题的解决
- 利用CSS3在Angular中实现动画
- 初识angular框架后的所思所想
- 实例剖析AngularJS框架中数据的双向绑定运用
- 理解Angular数据双向绑定
- Angular中的Promise对象($q介绍)
- Angular实现form自动布局
- 自定义Angular指令与jQuery实现的Bootstrap风格数据双向绑定的单选与多选下拉框
- angular简介和其特点介绍
- AngularJS使用angular-formly进行表单验证
- 详解JavaScript的AngularJS框架中的作用域与数据绑定
- 给angular加上动画效遇到的问题总结
- 解决angular的$http.post()提交数据时后台接收不到参数值问题的方法
- Angular中$compile源码分析