angularJS(2)

今天先讲一个angularJs的表单绑定实例:

<div ng-app="myApp" ng-controller="formCtrl">
<form novalidate>
姓:<input type="text" ng-model="user.xing"><br>
名:<input type="text" ng-model="user.ming"><br>
<button ng-click="reset()">RESET</button>
</form>
<h2 style="color:#F00">新值 = {{user }}</h2>
<h2>原值 = {{master}}</h2>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('formCtrl', function($scope) {
$scope.master = {xing:"张", ming:"三"};
$scope.reset = function() {
$scope.user = angular.copy($scope.master);
};
$scope.reset();
});
</script>

注:novalidate 属性是在 HTML5 中新增的。禁用了使用浏览器的默认验证。

接下来写两个angularJs循环列举数组

<div ng-app=“” ng-init=“car=[‘宝马’,‘奥迪’,‘奔驰‘,’保时捷’,’法拉利’]">  <p>使用 ng-repeat 来循环数组</p>  <ul>    <li ng-repeat="x in car"> {{ x }}  </li>  </ul></div> 
<div ng-app=“” ng-init=“names=[{name:‘王小波’,class:‘傻子班’},{name:‘王如花’,class:‘大班’},{name:‘武则天’,class:‘预科班'}]">
<ul>
<li ng-repeat="x in names"> {{ x.name + ', ' + x.class }} </li>
</ul>
</div>

最新文章

  1. ipad上自定义view的旋转适配
  2. FibonacciSequence
  3. 《深入浅出WPF》笔记一
  4. C语言中的经典例题用javascript怎么解?(一)
  5. MYSQL 【汇总数据】 【分组数据】 学习记录
  6. 开发日志系列:一个表单页面的呈现与提交(一)——JSON的操作
  7. TreeView设置节点图标
  8. CSRF跨站点请求伪造漏洞问题
  9. Spring、XML配置AOP
  10. HDU 1025 DP + 二分
  11. ios GCD简单介绍 后台运行~
  12. C# 把Div变为滚动条
  13. eclipse报错排解
  14. spring boot2.0.4集成druid,用jmeter并发测试工具调用接口,druid查看监控的结果
  15. jquery中$.each()的用法
  16. js-当前时间转换
  17. WEBGIS网页崩溃问题分析
  18. Spring4之AOP
  19. git关于文件权限修改引起的冲突及忽略文件权限的办法
  20. Cartographer源码阅读(1):程序入口

热门文章

  1. 前端学HTTP之代理
  2. [Servlet] 初识Servlet
  3. 前端打包构建工具grunt快速入门(大篇幅完整版)
  4. Rafy 框架 - 为数据库生成注释
  5. 仅此一文让你明白ASP.NET MVC原理
  6. C# - 多线程 之 异步编程
  7. C#开发微信门户及应用(4)--关注用户列表及详细信息管理
  8. canvas调用scale或者drawImage图片操作后,锯齿感很明显的解决
  9. java中如何实现多态
  10. AOS – 另外一个独特的页面滚动动画库(CSS3)