1、为什么其他标签可以用ng-bind ,而input标签要用ng-model

这就是所谓的数据双向绑定,input是用于用户输入的,数据要从View传输到Controller中,而{{}}和ng-bind是用于从controller中得到数据然后显示在view中的

2、{{}}和ng-bind的区别

在angularjs中限制模型中的数据有两种方式:

一种是使用花括号插值的方式:

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

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

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

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

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

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

angularjs之ng-bind和ng-model的更多相关文章

  1. angular报错:angular.min.js:118Error: [ng:areq] http://errors.angularjs.org/1.5.8/ng/areq

    报错代码如下: <div ng-controller="HelloAngular"> <p>{{greeting.text}},angular</p& ...

  2. Part 14 ng hide and ng show in AngularJS

    ng-hide and ng-show directives are used to control the visibility of the HTML elements. Let us under ...

  3. angular.min.js:118 Error: [ng:areq] http://errors.angularjs.org/1.5.8/ng/areq?

    1,错误如图所示 简单说下错误原因是:没有js没有注册进去. 解决方法: 1.看下index.html有没有引入你的js文件. 2.看下app.js有没有注册js,比如我这次就是这步没做好,合并代码时 ...

  4. AngularJS中angular.min.js:80 Error: [ng:areq] http://errors.angularjs.org/1.2.9/ng/areq

    报出来的时候,出现这种错误,是因为在引入控制器的时候没有引入成功,我遇到这个错误是在因为没有将父控制器引入到子控制器中.

  5. Angular6之ng build | ng build --aot | ng build --prod 差异

    由于写了大半年的项目终于要告一段落并且即将进行第二阶段优化开发,emmm 基础版本已经二十多个模块了,必不可少的优化是很重要的,尽管项目上使用多层嵌套懒加载,但是在首屏加载的时候,任然很慢啊,因为一直 ...

  6. 在库中使用schematics——ng add与ng update

    起步 创建一个angular库 ng new demo --create-application=false ng g library my-lib 可见如下目录结构 ├── node_modules ...

  7. AngularJS方法 —— angular.bind

    描述: 上下文,函数以及参数动态绑定,返回值为绑定之后的函数. 其中args是可选的动态参数,self在fn中使用this调用. 使用方法: angular.bind(self,fn,args ); ...

  8. angularJS $scope的$apply方法实现model刷新

    控制器内,$scope有个$apply方法,可以代码更改model并同步更新页面.通常,控制器内的方法执行完毕后仅会自动刷新一次页面展示,使用$apply方法即可在想刷新页面时就刷新.如本例,这个方法 ...

  9. Error: [ng:areq]

    错误描述:Error: [ng:areq] http://errors.angularjs.org/1.4.8/ng/areq?p0=HelloCtrl&p1=not%20a%20functi ...

  10. 翻译-让ng的$http服务与jQuerr.ajax()一样易用

    Make AngularJS $http service behave like jQuery.ajax() 让ng的$http服务与jQuerr.ajax()一样易用 作者zeke There is ...

随机推荐

  1. 安装交叉编译的 GCC 时出现的错误

    错误如下: ../.././libgcc/../config-ml.: enable_libstdc++_v3=yes: command not found make[]: Entering dire ...

  2. vijos P1915 解方程 加强版

    背景 B酱为NOIP 2014出了一道有趣的题目, 可是在NOIP现场, B酱发现数据规模给错了, 他很伤心, 哭得很可怜..... 为了安慰可怜的B酱, vijos刻意挂出来了真实的题目! 描述 已 ...

  3. Python-07-面向对象(进阶篇)

    1.面向对象高级语法部分 1.1 静态方法 通过 @staticmethod 装饰器即可把其装饰的方法变为一个静态方法,什么是静态方法呢?其实不难理解,普通的方法,可以在实例化后直接调用,并且在方法里 ...

  4. 文件上传---普通文件fileupload.jar和url文件httpUrlConnection

    文件上传---普通文件和url文件 主要用来学习使用common-fileupload.jar和java.net.httpURLConnection 普通文件: //上传xls文件到临时目录 if ( ...

  5. LeetCode:Max Points on a Line

    题目链接 Given n points on a 2D plane, find the maximum number of points that lie on the same straight l ...

  6. ionic 开发笔记

    1.AngularJS 外部的控制器(DOM 事件.外部的回调函数如 jQuery UI 空间等)调用了 AngularJS 函数之后,必须调用$apply.在这种情况下,你需要命令 AngularJ ...

  7. windows2012 iis配置

    1.打开“组策略” 单击任务栏里的“windows powershell”, 键入 gpedit.msc,然后按 Enter. 2.修改windows 更新源为未配置.“计算机配置”---“管理模板” ...

  8. Scrapy的中Css 选择器

    //通过 名为 video_part_lists 的Class 中下面的 li 标签 liList = response.css('.video_part_lists li') for li in l ...

  9. HDU1086You can Solve a Geometry Problem too(判断线段相交)

    You can Solve a Geometry Problem too Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/3 ...

  10. BootStrap的一个标准框架的内容解释——来源于bootstrap官网

    <!DOCTYPE html><!--HTML5的定义--><html lang="zh-cn"> <head> <meta ...