我是Angular JS的新手。以下代码无效。我尝试过使用Ng-Repeat的数据表。但它只显示表没有任何排序,分页选项。
响应数据如下:
[{
\"ACCOUNT_LOCAL\":\"9007\",\"COMPANY_ID\":\"10001\",
\"ACCOUNT_GLOBAL\":\"100001\",\"IC_PARTNER\":\"9008\",
\"ACCOUNT_GLOBAL_DESC\":\"AUS GLOBAL\",
\"ACCOUNT_TYPE\":\"1\",\"COMPANY_DESC\":\"THIRDROCK\",
\"ACTIVE\":true
},
{
\"ACCOUNT_LOCAL\":\"9008\",\"COMPANY_ID\":\"10001\",
\"ACCOUNT_GLOBAL\":\"100001\",\"IC_PARTNER\":\"9009\",
\"ACCOUNT_GLOBAL_DESC\":\"AUS GLOBAL\",
\"ACCOUNT_TYPE\":\"1\",\"COMPANY_DESC\":\"THIRDROCK\",
\"ACTIVE\":true
},{
\"ACCOUNT_LOCAL\":\"9014\",\"COMPANY_ID\":\"10001\",
\"ACCOUNT_GLOBAL\":\"100001\",\"IC_PARTNER\":\"TEST\",
\"ACCOUNT_GLOBAL_DESC\":\"AUS GLOBAL\",
\"ACCOUNT_TYPE\":\"1\",\"COMPANY_DESC\":\"THIRDROCK\",
\"ACTIVE\":true
},
HTML文件
<div ng-app="myApp" ng-controller="AccountMappingCtrl as vm">
<table ng-table="vm.tableParams" show-filter="true" class="table">
<tr ng-repeat="accountMap in $data">
<td title="'IC_PARTNER'" filter="{ IC_PARTNER: 'text'}" sortable="'IC_PARTNER'">
{{ accountMap.IC_PARTNER }}
</td>
<td title="'ACCOUNT_GLOBAL'" filter="{ ACCOUNT_GLOBAL: 'text'}" sortable="'ACCOUNT_GLOBAL'">
{ accountMap.ACCOUNT_GLOBAL }}
</td>
</tr>
</table>
</div>
&#13;
JS文件:
var app = angular.module('myApp', [ 'ngTable']);
app.controller('AccountMappingCtrl', ['$scope', '$http','$cookies', 'NgTableParams', function($scope, $http, $filter, NgTableParams) {
$http.get("http://localhost:52087/api/accountmapping")
.then(function(response) {
var convertJson = angular.fromJson(response.data);
var self = this;
var data = convertJson;
self.tableParams = new NgTableParams({}, { dataset: data});
});
});
答案 0 :(得分:0)
var myApp = angular.module('myApp',["ngTable"]);
//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});
myApp.controller('MyCtrl',function($scope,NgTableParams){
$scope.name = 'Superhero';
var data = [{
"ACCOUNT_LOCAL":"9007","COMPANY_ID":"10001",
"ACCOUNT_GLOBAL":"100001","IC_PARTNER":"9008",
"ACCOUNT_GLOBAL_DESC":"AUS GLOBAL",
"ACCOUNT_TYPE":"1","COMPANY_DESC":"THIRDROCK",
"ACTIVE":true
},
{
"ACCOUNT_LOCAL":"9008","COMPANY_ID":"10001",
"ACCOUNT_GLOBAL":"100001","IC_PARTNER":"9009",
"ACCOUNT_GLOBAL_DESC":"AUS GLOBAL",
"ACCOUNT_TYPE":"1","COMPANY_DESC":"THIRDROCK",
"ACTIVE":true
},{
"ACCOUNT_LOCAL":"9014","COMPANY_ID":"10001",
"ACCOUNT_GLOBAL":"100001","IC_PARTNER":"TEST",
"ACCOUNT_GLOBAL_DESC":"AUS GLOBAL",
"ACCOUNT_TYPE":"1","COMPANY_DESC":"THIRDROCK",
"ACTIVE":true
}]
//your HTTP call here
$scope.tableParams = new NgTableParams({}, { dataset: data});
})
&#13;
<div ng-app="myApp" ng-controller="MyCtrl">
Hello, {{name}}!
<table ng-table="tableParams" show-filter="true" class="table">
<tr ng-repeat="accountMap in $data">
<td title="'IC_PARTNER'" filter="{ IC_PARTNER: 'text'}" sortable="'IC_PARTNER'">
{{ accountMap.IC_PARTNER }}
</td>
<td title="'ACCOUNT_GLOBAL'" filter="{ ACCOUNT_GLOBAL: 'text'}" sortable="'ACCOUNT_GLOBAL'">
{{ accountMap.ACCOUNT_GLOBAL }}
</td>
</tr>
</table>
</div>
<link rel="stylesheet"; href="https://unpkg.com/ng-table@2.0.2/bundles/ng-table.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular.js"></script>
<script src="https://unpkg.com/ng-table@2.0.2/bundles/ng-table.min.js"></script>
&#13;
您的代码{ accountMap.ACCOUNT_GLOBAL }}
中的类型应为{{ accountMap.ACCOUNT_GLOBAL }}
我制作了你的测试数据。请检查this小提琴,它工作正常。