即使很多研究都無法找到一個可以幫助我在本地運行角度UI-GRID示例的好例子。在頁面上不顯示網格的角度UI-GRID
下面是HTML文件,該文件正在使用,簡單的文件名爲index.html:
<!doctype html>
<html ng-app="app">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-touch.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-animate.js"></script>
<script src="release/ui-bootstrap-tpls-0.12.1.min"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" href="release/ui-grid-unstable.css"/>
<link rel="stylesheet" href="main.css"/>
<script src="release/ui-grid-unstable.js"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-controller="MainCtrl">
<div id="grid1" ui-grid="{ data: myData }" class="grid"></div>
</div>
</body>
</html>
這裏是你可以在爲HTML相同的路徑放置app.js。
var app = angular.module('app', ['ngTouch', 'ui.grid']);
app.controller('MainCtrl', ['$scope', function ($scope) {
$scope.myData = [
{
"firstName": "Cox",
"lastName": "Carney",
"company": "Enormo",
"employed": true
},
{
"firstName": "Lorraine",
"lastName": "Wise",
"company": "Comveyer",
"employed": false
},
{
"firstName": "Nancy",
"lastName": "Waters",
"company": "Fuelton",
"employed": false
}]
,columnDefs: [field: 'firstName', displayName: 'First Name', width: '30%', maxWidth: 200, minWidth: 70],
[field: 'lastName', displayName: 'Last Name', width: '30%', maxWidth: 200, minWidth: 70];
}]);
的UI併網unstable.js和UI併網unstable.css從鏈接下載:
http://ui-grid.info/release/ui-grid-unstable.js 和 http://ui-grid.info/release/ui-grid-unstable.css
請請你幫我我只是花時間來運行這個。
我能夠爲我的需求運行ng-grid,但由於沒有列和行調整功能,我不得不現在切換到ui-grid。
其實我看着一切,按照規定我能夠在NG-GRID我的代碼運行,但我想要的是做在ui-grid中,它仍然不穩定但正在工作。 – 2015-04-06 10:00:01
看到這個http://plnkr.co/edit/Tr9cNm0lDy62dmF7LNlr?p=preview是否有幫助 – Reena 2015-04-06 10:17:18
非常感謝Reena。這有助於:) – 2015-04-09 01:56:14