我在论坛上几乎每个问题都说“ng-repeat not working”.但仍然无法找到答案.
(请注意：我第一次尝试通过$http创建工厂服务来获取数据)
请查看我的以下JavaScript代码(模块,控制器和工厂在一个地方定义)
//App declaration
var myApp = angular.module("appLeadsLogRpt",[]);
//Controller declaration
myApp.controller('controllerLeadsLogRpt',['dataService',fncontrollerLeadsLogRpt]);
function fncontrollerLeadsLogRpt(dataService) {
var vm = this;
//Table headers
vm.TableHeaders = ["Lead Id","Source","Create Date","Status","Contact Id","Customer Name","AssignedTo","Mail Content","Closed Reason","Last Lead Note"];
dataService.getAllData()
.then(getData,null)
.catch(showError);
function getData(data) {
vm.LeadsLogRptData = JSON.parse(data);
//console.log(JSON.parse(data));
}
function showError(errMsg) {
console.log(errMsg);
}
}
//Factory Service to fetch data
myApp.factory('dataService',['$http',DataService]);
function DataService($http) {
return {
getAllData: GetAllData
};
function GetAllData() {
return $http({
method: 'get',url: 'DataHandler.ashx?method=leadsReport&listId=504473'
})
.then(sendResponseData)
.catch(sendError)
}
function sendResponseData(response) {
return response.data;
}
function sendError(response) {
return response.status;
}
}
</script>
我的Html如下：
<div id="DvContent" style="width:100%" data-ng-app="appLeadsLogRpt">
<div style="width:100%;" data-ng-controller="controllerLeadsLogRpt as vm1">
<input type="text" id="txtJsonData" value='<%=jsonLeadsLogRpt %>' style="display:none" />
<div><h3>Leads Log Report</h3></div>
<div style="text-align:right;margin-bottom:2px;padding-right:2px;">
<a href="javascript:void(0);" data-ng-click="ExportToExcel();"><img src="/mp_images/excelicon.gif" border=0 width=22 height=22 alt="Open in Excel"></a>
</div>
<div id="divExportToExcel">
<table style="width:100%" id="tblLeadLogRpt" class="table table-bordered">
<thead>
<tr style="background-color:#CCCCCC">
<th data-ng-repeat="item in vm1.TableHeaders" class="ng-cloack">{{item}}</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="item1 in vm1.LeadsLogRptData">
<td class="ng-cloack">{{item1.A_LeadId}}</td>
<td class="ng-cloack">{{item1.B_Source}}</td>
<td colspan="8"></td>
</tr>
<tr data-ng-if="LeadsLogRptData.length==0"><td colspan="10">Data Not Found</td></tr>
</tbody>
</table>
</div>
</div>
</div>
如果我将服务器返回的硬编码数据分配给ng-repeat,它可以正常工作
请让我知道我做错了什么.
还有一个问题.
在Jquery中,我按照以下方式进行操作.
$.ajax({
url: 'AbcdHandler.ashx',type: 'POST',data: {
'method': 'ABCData','StartDate': startDate,'EndDate': endDate
},success: function (result) {
return JSON.parse(result);
},error: OnError
});
提前感谢阅读和帮助.
我的最新观察：
当我在控制台上写数据时,得到了这个. (看一下函数getData(data))
[{ “A_LeadId”： “426429”,“B_Source”： “的LabX”},{ “A_LeadId”： “429369”,{ “A_LeadId”： “430586”,“B_Source”： “信息”},{ “A_LeadId”： “430589”,{ “A_LeadId”： “433848”,“B_Source”： “LabX软件”},{ “A_LeadId”： “448592”,“B_Source”：“Info”},{“A_LeadId”：“451795”,“B_Source”：“出价”},{“A_LeadId”：“453008”,“B_Source”：“低出价”},{“A_LeadId” ：“453009”,{“A_LeadId”：“453010”,{“A_LeadId”：“455736”,“B_Source”：“信息” },{ “A_LeadId”： “455743”,{ “A_LeadId”： “457030”,{ “A_LeadId”： “457052”,“B_Source” ：“LabX”},{“A_LeadId”：“461503”,“B_Source”：“手动输入”}]
如果我复制它并直接分配给vm.LeadsLogRptData,系统会在屏幕上正确显示输出.
例如vm.LeadsLogRptData = [{“A_LeadId”：“426429”,“B_Source”：“LabX”},……];
还有一件事.当我检查数据长度时,它显示我621.({{vm.LeadsLogRptData.length}})
实际上只有15个大括号对({}),系统应该显示我的长度为15
希望我能正确解释/描述我的问题.
(需要以Json格式正确转换我的数据的东西)
谢谢,
我得到了答案
只需使用eval和Json.parse,系统就可以正常显示数据
例如vm.LeadsLogRptData = eval(JSON.parse(data));
有人请解释一下这背后的逻辑吗？
感谢所有阅读和回复的人.
解决方法
function GetAllData() {
return $http({
method: 'GET',url: 'http://localhost:12345/DataHandler.ashx',params: {method: "leadsReport",listId: 504473}
})
.then(sendResponseData)
.catch(sendError)
}
如果要执行POST请求,您应该像这样使用它：
function PostData() {
return $http({
method: 'POST',data: {exampleData: exampleData}
})
.then(sendResponseData)
.catch(sendError)
}
请记住为您的服务器URL更改http://localhost:12345/.
