我有一个应用程序,用户选择一个选项从服务器端获取网格数据,并取决于用户选择的选项,网格数据中的列数可能会有所不同.我正在使用Angularjs和ng-grid来显示数据.第一次,它工作正常,它确实显示正确的列数(例如2列).但是当用户选择其他选项(获得3列网格数据)时,ng-grid仍会考虑旧列信息并尝试在旧2列中映射第二个3-cols网格数据.由于列信息不可用,我无法在控制器中使用columnDefs.如何刷新ng-grid列.
注意:我试图将代码放在jsFiddle(http://jsfiddle.net/User888/pwUeX/11/),但不知何故,我无法运行它.我的完整代码在这里.
另外:如何在不从服务器发送行的情况下在ng-grid中显示行#.
My HTML file:
<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
<meta charset="utf-8">
<title>test </title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script type="text/javascript" src="http://angular-ui.github.io/ng-grid/lib/ng-grid.js"></script>
<script type="text/javascript" src="gridExample.js"></script>
<link rel="stylesheet" type="text/css" href="http://angular-ui.github.io/ng-grid/css/ng-grid.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body ng-controller="GridExampleCtrl">
<div>
Grid Selection:
<select ng-model="gridSelectedId">
<option ng-repeat="gridSel in gridSels" value="{{gridSel.GridSelId}}">{{gridSel.GridSelName}}</option>
</select>
<br/>User selected: {{gridSelectedId}} <br><hr>
<div>
<button ng-click="display()">Display</button><hr>
<div class="gridStyle" ng-grid="gridOptions"></div>
</div>
</div>
</body>
</html>
我的控制器是:
var app = angular.module('myApp', ['ngGrid']);
app.controller('GridExampleCtrl', function ($scope, $http, $timeout) { …