AngularJs学习——实现数据绑定的三种方式
2024-09-04 17:23:31
三种方式:
- 方式一:<h5>{{msg}}</h5> 此方式在页面刷新的时候会闪现{{}}
- 方式二:<h5 ng-bind="msg"></h5>
- 方式三:<h5 ng-clock class="ng-clock">{{msg}}</h5>
示例代码:
<!DOCTYPE html>
<html lang="en" ng-app="myapp">
<head>
<meta charset="UTF-8">
<title>AngularJs12-实现数据绑定的三种方式</title>
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css"/>
</head>
<body>
<div ng-controller="MyCtrl" style="padding: 60px;">
<input type="text" class="form-control" ng-model="msg">
<!-- 方式1 -->
<h5>{{msg}}</h5>
<!-- 方式2 -->
<h5 ng-bind="msg"></h5>
<!-- 方式3 -->
<h5 ng-clock class="ng-clock">{{msg}}</h5>
</div>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<script>
angular.module('myapp',[])
.controller('MyCtrl',function($scope){
$scope.msg = 'Hello Angular!'
})
</script>
</body>
</html>
最新文章
- Json&;Razor&;控制器
- Java基础(5):试用Array类对数据进行操作(Sort和toString方法)
- Myeclipse 添加server library
- HDU 4906 Our happy ending(2014 Multi-University Training Contest 4)
- JAVA正则表达式语法大全
- VmodCAM 初始化
- seajs 2.3.0 加入jquery
- jQuery慢慢啃之事件对象(十一)
- CSU 1559 订外卖
- NSString属性什么时候用copy,什么时候用strong?【转】
- https tomcat 证书搭建
- C#写PDF文件类库PDF File Writer介绍
- weblogic AND jboss 反序列化漏洞
- windows系统下用python更新svn和Git
- 安卓BLE测试apk
- EasyPR源码剖析(5):车牌定位之偏斜扭转
- Linux-3.0.8中基于S5PV210的IRQ模块代码追踪和分析
- JS =>;处理单击事件与拖动事件并存
- 设计模式之Decorator(油漆工)(转)
- 裴(pei)蜀定理 知识点