<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible"content="edge" />
<meta name="viewport"content="width=device-width,initial-scale=1" />
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap/css/bootstrap.min.css" />
<style>

</style>
</head>
<body>
<div class="container"style="padding:50px">
<div data-ng-app="myApp"data-ng-controller="myCtrl">
<table class="table table-bordered table-striped">
<tr>
<th class="col-xs-3"></th><th class="col-xs-3 text-center">P2P</th><th class="col-xs-3 text-center">余额宝</th><th class="col-xs-3 text-center">银行理财产品</th>
</tr>
<tr data-ng-repeat="info in infoList">
<td class="text-center">{{info.title}}</td><td class="text-center">{{info.p2p}}</td><td class="text-center">{{info.yeb}}</td><td class="text-center">{{info.bank}}</td>

</tr>
</table>

</div>
</div>

<script src="jQuery/jquery-2.2.0.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<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.infoList = [
{ title: "预期年化收益率", p2p: "约 7% - 14%", yeb: "约 3% - 4%", bank: "约 4% - 5.5%" },
{ title: "买入当天生息", p2p: true, yeb: false, bank: false },
{ title: "买入次日开始付息", p2p: true, yeb: false, bank: false },
{ title: "每日付息", p2p: true, yeb: true, bank: false },
{ title: "每日利息自动复投", p2p: true, yeb: true, bank: false },
{ title: "期限灵活，随时可取", p2p: true, yeb: true, bank: false },
{title:"可以零钱增投",p2p:true,yeb:true,bank:true}
]
})
</script>
</body>
</html>

Angularjs实例3的更多相关文章

  1. Flask+ Angularjs 实例： 创建博客

    允许任何用户注册 允许注册的用户登录 允许登录的用户创建博客 允许在首页展示博客 允许登录的用户退 后端 Flask-RESTful - Flask 的 RESTful 扩展 Flask-SQLAlc ...

  2. AngularJS实例实战

    学习了这么多天的AngularJS,今天想从实战的角度和大家分享一个简单的Demo--用户查询系统,以巩固之前所学知识.功能需求需要满足两点 1.查询所有用户信息,并在前端展示 2.根据id查询用户信 ...

  3. AngularJs 实例

    1.AngularJs 表单验证: 示例 .controller('signupController', ['$scope', function($scope) { $scope.submitted ...

  4. Angularjs实例5

    <!DOCTYPE html><html lang="zh-cn" ng-app="myApp"><head><met ...

  5. Angularjs实例2

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  6. angularjs实例

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...

  7. Angularjs实例4

    <!DOCTYPE html><html lang="zh-cn" ng-app=""><head><meta htt ...

  8. Angularjs实例应用

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  9. Angularjs实例1

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

随机推荐

  1. 深入理解JavaScript系列（26）：设计模式之构造函数模式

    介绍 构造函数大家都很熟悉了,不过如果你是新手,还是有必要来了解一下什么叫构造函数的.构造函数用于创建特定类型的对象——不仅声明了使用的对象,构造函数还可以接受参数以便第一次创建对象的时候设置对象的成 ...

  2. PLC总结

    PLC编程总结 PLC控制部分总体有三大部分组成,PLC硬件,组态以及梯形图程序.PLC硬件应与组态一一对应,不容有任何偏差:而梯形图与操作的组态的IO口也应该一一对应.因此,整个系统达到了由梯形图程 ...

  3. 设置session超时的三种方式

    设置session超时的三种方式 1. 在容器中设置:如在tomcat-7\conf\web.xml中设置 Tomcat默认session超时时间为30分钟,可以根据需要修改,负数或0为不限制sess ...

  4. 【Linux】安装Nginx

    注:转自https://www.cnblogs.com/hdnav/p/7941165.html 安装所需环境 Nginx 是 C语言 开发,建议在 Linux 上运行,当然,也可以安装 Window ...

  5. Spring课程 Spring入门篇 4-8 Spring bean装配之基于java的容器注解说明--基于泛型的自动装配

    1 解析 1.1 什么是泛型? 1.2 泛型有什么作用? 1.3 泛型装配样式? 2 代码演练 2.1 泛型应用 1 解析 1.1 什么是泛型? Java泛型设计原则:只要在编译时期没有出现警告,那么 ...

  6. mysql五：pymysql模块

    一.介绍 之前都是通过MySQ自带的命令行客户端工具Mysql来操作数据库,那如何在Python程序中操作数据库呢?这就需要用到pymysql模块了. 这个模块本质就是一个套接字客户端软件,使用前需要 ...

  7. Microsoft BI - SSRS

    1. Shared Dataset 功能在 SQL Server 2008 R2 / 2012 / 2014 的下列三个版本中不支持,详情请参考此处: Express Edition with Adv ...

  8. SharePoint Tricks

    1. 64位IE浏览器无法使用Open with Explorer功能,而且会直接用浏览器去打开office文件(不管是否选择使用客户端打开) 2. 对于 large list or library, ...

  9. java 理解有符号数和无符号数

    转至:http://jinguo.iteye.com/blog/212049 理解有符号数和无符号数负数在计算机中如何表示呢? 这一点,你可能听过两种不同的回答. 一种是教科书,它会告诉你:计算机用“ ...

  10. idea 新建文件夹目录问题解决

    选中工程,设置,去掉选项“Compact Empty Middle Packages” .