anjular.js读取数据库数据调用实例
生活随笔
收集整理的這篇文章主要介紹了
anjular.js读取数据库数据调用实例
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
以下是實例代碼：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> <style> table{position:relative;} table, th , td {border: 1px solid grey;border-collapse: collapse;padding: 10px 20px; } table tr:nth-child(odd) {background-color: #f1f1f1; } table tr:nth-child(even) {background-color: #ffffff; } i{display:block;background:url(buffer.gif) no-repeat;position:absolute;left:50%;margin-left:-16px;top:50px;width:32px;height:32px;} </style> </head> <body> <center style="margin-top:100px;"> <div ng-app="myApp" ng-controller="customersCtrl"><h3>數(shù)據(jù)統(tǒng)計</h3> <table><tr><th>編號</th><th>名稱</th><th>點擊</th><th>訪問時間<i id="buffer"></i></th><th>所屬</th></tr><tr ng-repeat="x in names"><td>{{ x.id }} </td> <!--編號--><td>{{ x.name }} </td> <!--名稱--> <td>{{ x.click }} 次</td> <!--點擊--><td>{{ x.time | date:'yyyy-MM-dd HH:mm:ss' }}</td> <!--時間--><td>{{ x.cate}}</td> <!--所屬--></tr> </table></div> </center> <script> var buffer = document.getElementById("buffer"); buffer.style.display = 'block';var app = angular.module('myApp', []); app.controller('customersCtrl', function($scope, $http) {$http.get("數(shù)據(jù)接口地址").success(function (response) {$scope.names = response; buffer.style.display = 'none'; }); });</script></body> </html>注：有連接外部地址，時間久遠的緣故，可能已經(jīng)失效。
創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎勵來咯，堅持創(chuàng)作打卡瓜分現(xiàn)金大獎總結(jié)
以上是生活随笔為你收集整理的anjular.js读取数据库数据调用实例的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： windowswps怎么以文件形式发送_
- 下一篇： php的api数据接口书写实例