我使用ng-table组件
在我的bower.json中:
{
"name": "angular-seed",
"description": "A starter project for AngularJS",
"version": "0.0.0",
"homepage": "https://github.com/angular/angular-seed",
"license": "MIT",
"private": true,
"dependencies": {
...
"ng-table": "~0.3.3"
}
}
在我的index.html中:
<!doctype html>
<html lang="fr" ng-app="test" ng-controller="TitleCtrl">
<head>
...
<script src="bower_components/ng-table/ng-table.js"></script>
<link rel="stylesheet" href="bower_components/ng-table/ng-table.css"/>
...
</head>
<body>
<ng-include src="'menu/menu.html'"></ng-include>
<div ng-view style="padding-left: 20px;padding-right: 20px;"></div>
</body>
</html>
在我的table.html中:
<form class="form-horizontal narrow" role="form">
<div ng-controller="PropertiesCtrl">
<p><strong>Page:</strong> {{tableParams.page()}}</p>
<p><strong>Count per page:</strong> {{tableParams.count()}}</p>
<table ng-table="tableParams" class="table">
<tr ng-repeat="user in $data">
<td data-title="'Name'">{{user.name}}</td>
<td data-title="'Age'">{{user.age}}</td>
</tr>
</table>
</div>
</form>
在我的properties.js中:
var propertiesModule = angular.module('test.properties', ['ngTable']);
propertiesModule.controller('PropertiesCtrl', ['$scope', '$routeParams', 'PropertiesService', 'ApplicationService', 'PlatformService', 'Page', '$filter', 'ngTableParams', function ($scope, $routeParams, PropertiesService, ApplicationService, PlatformService, Page, $filter, ngTableParams) {
...
$scope.on_edit_unit = function () {
var data = [{name: "Moroni", age: 50},
{name: "Tiancum", age: 43},
{name: "Jacob", age: 27},
{name: "Nephi", age: 29},
{name: "Enos", age: 34},
{name: "Tiancum", age: 43},
{name: "Jacob", age: 27},
{name: "Nephi", age: 29},
{name: "Enos", age: 34},
{name: "Tiancum", age: 43},
{name: "Jacob", age: 27},
{name: "Nephi", age: 29},
{name: "Enos", age: 34},
{name: "Tiancum", age: 43},
{name: "Jacob", age: 27},
{name: "Nephi", age: 29},
{name: "Enos", age: 34}];
$scope.tableParams = new ngTableParams({
page: 1, // show first page
count: 10 // count per page
}, {
total: data.length, // length of data
getData: function($defer, params) {
$defer.resolve(data.slice((params.page() - 1) * params.count(), params.page() * params.count()));
}
});
console.log( data);
console.log( $scope.tableParams);
});
};
...
当我登录控制台 $ scope.tableParams :
时ngTableParams {data:Array [0],参数:function,settings: function,page:function,total:function ...}
为什么 ngTableParams 中没有数据?
UPDATE init a PLUNKER: