<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible"content="IE=edge" />
<meta name="viewport"content="width=device-width,initial-scale=1" />
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet"href="bootstrap-3.3.6-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container"style="padding:50px">
<div data-ng-app="myApp"data-ng-controller="myCtrl">
<table class="table table-striped">
<tr data-ng-repeat="x in names">
<td>{{x.liaohao}}</td><td>{{x.xinghao}}</td>
</tr>
</table>
</div>
</div>
<script src="jQuery/jquery-2.1.4.min.js"></script>
<script src="bootstrap-3.3.6-dist/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, $http) { $http.get("json/json.json").success(function (response) { $scope.names=response.records}) })
</script>
</body>
</html>

json.json

{
"records": [
{
"liaohao": "03020001",
"xinghao": "FR100-4T-2.2BDRV1"
},
{
"liaohao": "03020002",
"xinghao": "FR100-4T-2.2BDRV2"
},
{
"liaohao": "03020003",
"xinghao": "FR100-4T-2.2BDRV3"
},
{
"liaohao": "03020004",
"xinghao": "FR100-4T-2.2BDRV4"
},
{
"liaohao": "03020005",
"xinghao": "FR100-4T-2.2BDRV5"
},
{
"liaohao": "03020006",
"xinghao": "FR100-4T-2.2BDRV6"
},
{
"liaohao": "03020007",
"xinghao": "FR100-4T-2.2BDRV7"
}

]
}

AngularJS显示一个简单表格的更多相关文章

  1. PyCharm Django 显示一个简单页面

    1.创建项目及创建应用 如:创建一个名zqxt_tmpl的项目,创建一个 learn的应用 在(Terminal)中执行 django-admin.py startproject zqxt_tmpl ...

  2. Ruby学习笔记2 ： 一个简单的Ruby网站，搭建ruby环境

    Ruby on Rails website 的基础是 请求-返回 循环. 首先是浏览器请求服务器, 第二步,Second, in our Rails application, the route ta ...

  3. cal - 显示一个日历

    总览 cal [-mjy ] [月份 [年份 ] ] 描述 Cal 显示一个简单的日历.. 如果没有指定参数, 则显示当前月份. 选项如下所列: -m 显示星期一作为一周的第一天.. (缺省为星期日. ...

  4. 实现一个竖直的显示表头的表格（vue版本）

    今天遇到一个问题,实现这样一个竖直的显示表头的表格,如下图.默认显示两列. vue实现代码如下:   tableComponent.vue:   <template> <table ...

  5. 如何用latex画一个简单的表格

    latex毫无疑问是一个十分强大的论文写作工具,所以掌握它就显得非常有意义,讲一下如何画一个简单的表格,代码如下: \begin{table}\centering\begin{tabular}{||c ...

  6. 【UI插件】开发一个简单日历插件（上）

    前言 最近开始整理我们的单页应用框架了,虽然可能比不上MVVM模式的开发效率,也可能没有Backbone框架模块清晰,但是好歹也是自己开发出来 而且也用于了这么多频道的东西,如果没有总结,没有整理,没 ...

  7. 使用React并做一个简单的to-do-list

    1. 前言 说到React,我从一年之前就开始试着了解并且看了相关的入门教程,而且还买过一本<React:引领未来的用户界面开发框架 >拜读.React的轻量组件化的思想及其virtual ...

  8. 用Qt写软件系列三：一个简单的系统工具（上）

    导言 继上篇<用Qt写软件系列二:QIECookieViewer>之后,有一段时间没有更新博客了.这次要写的是一个简单的系统工具,需求来自一个内部项目.功能其实很简单,就是查看当前当前系统 ...

  9. SqlSever基础 union 联合查询，厉害的并集 重复项只显示一个 两个查询结果并在一起后排序

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...

随机推荐

  1. 白话SpringCloud | 第三章：服务注册与发现(Eureka)-下

    前言 上一章节,讲解了在单机模式下的服务注册与发现的相关知识点及简单示例.而在实际生产或者在这种微服务架构的分布式环境中,需要考虑发生故障时,各组件的高可用.而其实高可用,我的简单粗俗理解就是,通过系 ...

  2. AtCoder Grand Contest 023 F - 01 on Tree

    Description 题面 Solution HNOI-day2-t2 复制上去,删点东西,即可 \(AC\) #include<bits/stdc++.h> using namespa ...

  3. [转]NLog学习笔记二：深入学习

    本文转自:http://www.cnblogs.com/CCHUncle/p/5207735.html 配置文件 NLog所有的配置信息都可以写到一个单独的xml文件中,也可以在程序代码中进行配置. ...

  4. C#字符串替换_无视大小写

    C#里的string.Replace是不能无视大小写的. 首先想到的是正则表达式,在网上查了下,果然有用正则表达式配合一些逻辑运算,实现无视大小写的字符串替换方法.但是正则表达式的方法用起来很麻烦,实 ...

  5. Hashtable元素的删除

    2中方法 Remove(); Clear(); static void Main(string[] args) { Hashtable ht = new Hashtable(); ht.Add(1,& ...

  6. Spring Chapter4 WebSocket 胡乱翻译 （二）

    书接上文,Spring Chapter4 WebSocket 胡乱翻译 (一) 4.4.4. 消息流 一旦暴露了STOMP端点,Spring应用程序就成为连接客户端的STOMP代理. 本节介绍服务器端 ...

  7. HDU 3397 区间覆盖，颠倒，合并（好题）

    http://acm.hust.edu.cn/vjudge/problem/14689 三个操作 [a,b]覆盖为0 [a,b]覆盖为1 [a,b]颠倒每项 两个查询 [a,b]间1数量 [a,b]间 ...

  8. topshelf windows服务

    一 开发: 1.新建控制台程序 2.nuget下载topshelf,根据不同的net版本选择下载版本,本人4.5下载3.3.1 3.main方法中增加 HostFactory.Run(x => ...

  9. js中各个排序算法和sort函数的比较

    js中要实现数据排序,其实只需要用sort函数就能很好的满足了,但是我今天想知道他和其他排序算法的区别,比如耗时呀等.测了一组数据如下: // ---------- 一些排序算法 Sort = {} ...

  10. 原生js获取手机定位信息

    <script type="text/javascript"> function Location() {}; Location.prototype.getLocati ...