zoukankan      html  css  js  c++  java
  • anngular ng-repeat循环

    <html ng-app="myApp">
    <head>
    <title>angularjs-demo</title>
    <link href="bootstrap.min.css" rel="stylesheet">
    <link href="index.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/angular.js/1.6.4/angular.js"></script>
    </head>
    <body ng-controller="ctrl">
     <div class="table-responsive">
                <table class="table table-striped table-sm">
                  <tbody>
                    <thead>
                    <tr>
                      <th>课程</th>
                      <th>网址</th>
                      <th>学籍</th>
                     
                    </tr>
                  </thead>
                    <tr ng-repeat="item in items">
                      <td>{{item.Name}}</td>
                      <td>{{item.Url}}</td>
                      <td>{{item.Country}}</td>
                     
                    </tr>
                    <tr>
                      <td>1,002</td>
                      <td>amet</td>
                      <td>consectetur</td>
                    </tr>
                    
                  </tbody>
                </table>
              </div>
            </main>
          </div>
        </div>
    <script>
        var app = angular.module('myApp',[]);
        app.controller("ctrl",function($scope,$location){
            $scope.items = getStu();
        });
        
        function getStu() {
            return [ {
                "Name": "菜鸟教程",
                "Url": "www.runoob.com",
                "Country": "CN"
            },
            {
                "Name": "Google",
                "Url": "www.google.com",
                "Country": "USA"
            },
            {
                "Name": "Facebook",
                "Url": "www.facebook.com",
                "Country": "USA"
            },
            {
                "Name": "微博",
                "Url": "www.weibo.com",
                "Country": "CN"
            }];
        }
        </script>
    </body>
    </html>
    <!--  {
        "sites": [
            {
                "Name": "菜鸟教程",
                "Url": "www.runoob.com",
                "Country": "CN"
            },
            {
                "Name": "Google",
                "Url": "www.google.com",
                "Country": "USA"
            },
            {
                "Name": "Facebook",
                "Url": "www.facebook.com",
                "Country": "USA"
            },
            {
                "Name": "微博",
                "Url": "www.weibo.com",
                "Country": "CN"
            }
        ]
    } -->
  • 相关阅读:
    AutomaticallyProfile 自动化引擎 MyBatis和DB沟通的引擎 (根据数据库信息自动给生成实体类那些...)
    经典aop,
    IOC和DI区别,aop的第一个案例,注入方式(7种),aop的7个专业术语,注解的DI,代理(动态代理,静态代理)
    AOP(AOP概念,AOP专业术语,单例模式,bean的id和name属性,基于xml的DI, 构造注入,命名空间p注入,集合属性注入, List 配置文件)
    ajax
    spring基础
    一对多,多对一,自关联,多对多,一级缓存,二级缓存
    hql语法
    sql操作语言
    Oracle函数
  • 原文地址:https://www.cnblogs.com/zgqdbxb/p/9501219.html
Copyright © 2011-2022 走看看