What's the difference between ng-model and ng-bind

ng-bind has one-way data binding ($scope --> view). It has a shortcut {{ val }} which displays the scope value $scope.val inserted into html where val is a variable name.

ng-model is intended to be put inside of form elements and has two-way data binding ($scope --> view and view --> $scope) e.g. <input ng-model="val"/>.

ng-bind是从$scope -> view的单向绑定
ng-modle是$scope <-> view的双向绑定

在AngularJS中显示模型中的数据有两种方式:

<p>{{text}}</p>

另一种是使用基于属性的指令,叫做ng-bind:

<p ng-bind="text"></p>

主要区别在于,使用花括号语法时,在AngularJS使用数据替换模板中的花括号时,第一个加载的页面,通常是应用中的index.html,其未被渲染的模板可能会被用户看到。而使用第二站方法的视图不会遇到这种问题。

原因是,浏览器需要首先加载index.html页面,渲染它,然后AngularJS才能把它解析成你期望看到的内容。

所以,对于index.html页面中的数据绑定操作,建议采用ng-bind。那么在数据加载完成之前用户就不会看到任何内容。

最新文章

  1. BPM的魅力何在?
  2. 【hive】——Hive基本操作
  3. Tornado 结合memcached缓存页面
  4. Spring(3)—— Junit框架单元测试
  5. NLPP-03-Exercises
  6. 详解 Qt 线程间共享数据(用信号槽方式)
  7. Zmodem transfer canceled by remote side
  8. C#验证字符串是否是数字,是否包括中文,是否是邮箱格式,是否是电话格式
  9. Git使用规范
  10. C# 异步编程1 APM模式异步程序开发
  11. 预防黑客入侵 防黑必学的cmd命令vs网络安全
  12. 浅谈Await
  13. 戏说java多线程之CyclicBarrier(循环栅栏)的CyclicBarrier(int parties)构造方法
  14. 16个必须熟悉的linux服务器监控命令
  15. 不同系统下的字长------typedef的意义
  16. 蓝牙SDP协议概述
  17. linux服务samba与ftp篇
  18. JS定义一个立即执行的可重用函数
  19. Java编程的逻辑 (86) - 动态代理
  20. Vue 全局注册逐渐 和 局部注册组件

热门文章

  1. 我的第一篇java笔记
  2. Appium Capabilities 详解(Android适配/IOS后续再补充)
  3. Max answer(单调栈+ST表)
  4. JMeter 通过JSON Extractor 插件来提取响应结果
  5. K3精益版给物料添加属性,并在BOM中新增字段引用该属性
  6. Windows Server 2012 正式版/标准版/数据中心版安装序列号密钥
  7. Git命令参考手册
  8. FPGA學習筆記(肆)--- Star Test Bench Template Writer
  9. mysql too many connection 解决
  10. Vmware Workstation - linux系统下 VmTools 安装