如何在 AngularJS 数据表中使用 deferRender?



我试过这段代码。

网页代码

<table id="example" data-datatable="ng">
<thead>
<tr>
<th>S.No</th>
<th>Menu Name</th>
<th>Menu Link</th>
<th>Menu Path</th>
<th>Icon</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="x in names">
<td>{{x.iMenu_id}}</td>
<td>{{x.cMenu_Name}}</td>
<td>{{x.cLink}}</td>
<td>{{x.cHelpLink}}</td>
<td>{{x.cCss_Class}}</td>
</tr>
</tbody>
</table>

脚本代码

我正在使用此功能从 Web 服务获取数据。

(function (angular) {
' ';
angular.module('AngularApp', ['datatables'])
.controller('AngularCtrl', ['$scope', '$http', function ($scope, $http) {
$http.get("AngularJS.asmx/Page_Select")
.then(function (response) {
$scope.names = response.data.Table;
deferRender = true;
});
}])
})(window.angular);

Web 服务(C#( 代码

public class HelloWorldData
{
public String Message;
}
[WebMethod]
public void Page_Select()
{
JavaScriptSerializer js = new JavaScriptSerializer();
Context.Response.Clear();
Context.Response.ContentType = "application/json";
HelloWorldData data = new HelloWorldData();
string sql = "Exec PB_GetMasterDetails @opt=20";
SqlDataAdapter da = new SqlDataAdapter(sql, System.Configuration.ConfigurationManager.AppSettings["BB_CONSTR"]);
DataSet ds = new DataSet();
da.Fill(ds);
Context.Response.Write(JsonConvert.SerializeObject(ds, Newtonsoft.Json.Formatting.Indented));
}

输出我在网络服务中得到这个输出。

{
"Table": [
{
"iMenu_id": 10,
"cMenu_Name": "BIRTH REGISTER1",
"cLink": "/Ward/NewIPPatSearch.aspx",
"cHelpLink": "Help/About us/aboutaosta.html",
"cCss_Class": "icon-home"
},
{
"iMenu_id": 14,
"cMenu_Name": "CHANGE PASSWORD",
"cLink": "/UserAdmin/tchangepwd.aspx",
"cHelpLink": "Help/About us/aboutaosta.html",
"cCss_Class": "icon-home"
},
...
...
...
...
...
...
{
"iMenu_id": 2500,
"cMenu_Name": "CITY1",
"cLink": "/Masters/mCity.aspx",
"cHelpLink": "Help/About us/aboutaosta.html",
"cCss_Class": "icon-home"
}
]
}

这种方法对我有用,但是加载数据需要相当长的时间。所以我尝试了 deferRender 方法,但它对我不起作用。有人知道另一种解决方案吗?

你应该尝试分析你的瓶颈在哪里...
以下是我能想到的一些选项:

1.1 处理 WebRequest 的时间(您的数据库提取(
A1 - 优化数据库架构或其他优化

1.2 将响应数据传输到客户端的时间
A1 - 您可以压缩数据。
A2 - 您可以将数据分页到较小的组(~100 条记录(,这样用户将加载一些数据,并在短时间内获得更多数据,直到收到所有 2000+ 条记录。

1.3 客户端处理数据的时间。
A1 - 看起来合法,我没有看到任何应该放慢速度的东西,但我不是角忍者。

最新更新