angular框架的SmartAdmin模板如何请求后台数据

公司新项目用angular 并且要求在smartadmin里写，以前没用过，记一下。
1.在自己的模块里创建控制器controllers.js文件
文件里代码如下：

angular.module('app.Inspection').controller("inspection",function ($scope, Inspectionhttp ) {//Inspectionhttp是第二步里自己定义的名称，一定要传$scope.param = {//返回给后台的数据one: 1,two: 10,she: "",};$scope.loadData = function(pageNum) {console.log(pageNum);var param = {};angular.forEach($scope.param,function(item,val){//简单过滤空数据的函数if(item.toString()){param[val] = item;}})param.pageNum = pageNum || param.pageNum;Inspectionhttp.getPurchaseData(param).then(function(res) {//调用Inspectionhttp里的方法，这个前面的名字一定记得根据自己写的名字改$scope.pageInfo = res //调取数据成功把数据赋给$scope.pageInfo}, function(err) {console.log('load');//失败在控制台打印load})}$scope.loadData();}
);

第2步。创建service.js文件代码如下：

"use strict";angular.module('app.integratedQuery').service("CurrentQhttp" //"currentQhtttp"是你定义的接口的名称, function($http, $q, APP_CONFIG) {this.getPurchaseData = function(params) {var d = $q.defer();$http({method : 'POST',url : APP_CONFIG.baseUrl + '/storage/getTGStorages',params : params,}).then(function successCallback(response) {// 请求成功执行代码d.resolve(response.data);}, function errorCallback(response) {// 请求失败执行代码d.reject("error");});return d.promise;}
})

第3步。 HTML部分，因为我们公司这个项目大部分是表格，所以举个跟表格相关的例子：将获取到的后台数据渲染到table里

                        <table><thead><tr><th>序号</th><th data-class="expand">姓名</th><th>性别</th></tr></thead><tbody>  // pageInfo.list是第一步里存数据的<tr ng-repeat='item in pageInfo.list track by $index'><td>{{$index}}</td><td>{{itemName}}</td><td>{{item.sex}}</td></tr></tbody></table>

angular框架的SmartAdmin模板如何请求后台数据相关推荐

进一步封装axios并调用其读取数据（吐槽~在安卓9.0以下或者IOS10.X以下手机端H5页面不支持，在这两种情况下的系统只能使用ajax或者原生js请求后台数据）
注意!!!(修改于2020年7月18日) 在安卓9.0以下或者IOS10.X以下手机端H5页面不支持,在这两种情况下的系统只能使用ajax或者原生js请求后台数据报错截图如下报错内容: {&quo ...
jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法
jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法参考文章: (1)jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法 ( ...
ajax 请求成功再执行javascript,jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法...
jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...
调用$.ajax不成功,jquery中ajax请求后台数据成功后既不执行success也不执行error的完美解决方法...
jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...
JS 操作 HTML 和 AJAX 请求后台数据
为某个元素插入值,添加属性,添加子元素 1 <div class="col-sm-6"> 2 <select class="form-control&q ...
微信小程序开发工具能正常请求后台数据，手机预览请求失败
微信小程序开发工具能正常请求后台数据,手机预览请求失败问题描述微信开发者工具调试完想用手机预览效果,结果发现凡是后台请求都失败. 原因分析可能的原因有三个: 微信开发者工具详情里的本地设置,没有 ...
Vue 利用axios请求后台数据
说明:前后端代码不在同一个电脑上后端接口地址: http://ip:8888/Xqy/user/queryUser?name=xqy 一:准备工作导包: npm i axios 安装其他插件的时候 ...
c# webform ajax操作,C# WebForm开发前台请求后台数据的方法总结
说到前台请求后台数据,我们一般都是用到AJAX(异步JavaScript和XML) .AJAX 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的 ...
vue使用ajax提交数据,vue使用ajax请求后台数据的方法
vue使用ajax请求后台数据的方法发布时间:2020-10-15 16:54:41 来源:亿速云阅读:108 作者:栢白这篇文章主要介绍了vue使用ajax请求后台数据的方法,具有一定借鉴价值 ...
前端写接口请求后台数据存vuex中打印到控制台
最近从B站上面跟着敲 vue 的项目,多次看到有关于前台拿到后端的接口地址文档,写前端接口,然后请求后台数据,放到 vuex 当中,再然后再在需要展示数据时渲染出来,于是做个输出小结,分享出来,供大家 ...

angular框架的SmartAdmin模板如何请求后台数据

angular框架的SmartAdmin模板如何请求后台数据相关推荐

最新文章

热门文章

angular框架的SmartAdmin模板 如何请求后台数据

angular框架的SmartAdmin模板 如何请求后台数据相关推荐

最新文章

热门文章

angular框架的SmartAdmin模板如何请求后台数据

angular框架的SmartAdmin模板如何请求后台数据相关推荐