angularJs1.x <三、ng-bind>

在上一节我们说到angularJs的controller,我们平时用{{ }}取值是能够正常取值,但是会出现一定问题,因为AngularJs是在页面加载完毕之后进行脏数据检查,然后更新

所以在网络出现延迟的情况下我们就会出现页面刚打开 出现大量类似于{{ name }}的东西,页面加载完成后,这些又自动更新为所属属性的值;具体我们看下例子如下:


本例子必须启动服务器进行测试,如果将html拖入

首先,我在引入Angularjs之前先来一个alert(1)的js代码,大家知道alert会暂停js的代码执行

<script type="text/javascript">
alert(11);
</script>
                      <script src="../../angularJs/angular.min.js"></script> -
  <script src="../../angularJsDemo/03.ng-bind/controller.js"></script>

然后controller.js中的代码

var controllerDemo=function($scope){
//申明一个model
$scope.name="小明";
$scope.sex="男";
}

html页面中的代码

<div ng-app="">
<div ng-controller="controllerDemo">
<input type="text" ng-model="name" value="">
{{name}}

</div>
</div>

然后我们运行html文件:首先出现的是

点击确定后,恢复正常



此时,需要解决这类问题,只需要 将 {{name}} 用ng-bind方式进行获取,改为<div ng-bind="name"></div>,这里我是用的div,大家可以根据自己需要进行标签选择!修改后则不会出现点击确定前的情况了


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值