Angular.js入门

Posted on 2018-12-24 23:06  FLGB  阅读(145)  评论(0编辑  收藏  举报

一、引入angular.js

     <script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script>

二、定义控制器、模块

    

<script type="text/javascript">
        var app = angular.module('eshop',[]);
        app.controller('brandController',function($scope,$http){
            //获取查询数据
            $scope.findAll= function(){
                $http.get('../brand/getAllBrand.do').success(
                    function(res){
                        $scope.list = res;
                    }        
                )
            }
        });
    </script>

三、在body标签中引入变量

<body class="hold-transition skin-red sidebar-mini" ng-app="eshop" ng-controller="brandController" ng-init="findAll()">

四、在对应的列表中显示

                                  <tbody>
                                      <tr ng-repeat="entity in list">
                                          <td><input  type="checkbox" ></td>                                          
                                          <td>{{entity.id}}</td>
                                          <td>{{entity.name}}</td>                                         
                                          <td>{{entity.firstChar}}</td>                                         
                                          <td class="text-center">                                           
                                               <button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal"  >修改</button>                                           
                                          </td>
                                      </tr>
                                  </tbody>

 



Copyright © 2024 FLGB
Powered by .NET 9.0 on Kubernetes