ng-grid 不显示任何数据
ng-grid is not displaying any data
3 小时以来,我一直在尝试在 ng-grid 中显示 json 数据,但无法做到 it.I 已按照 ng 入门指南中给出的说明进行操作 - grid.But 无法显示网格中的数据。
在我的UserEdit.aspx页面中我的HTML代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UserEdit.aspx.cs" Inherits="SampleWebApp.UserEdit" %>
<!DOCTYPE html>
<html >
<head runat="server">
<script src="/Scripts/angular.js"></script>
<script src="/Scripts/jquery-1.9.1.js"></script>
<script src="/Scripts/ng-grid-2.0.14.min.js"></script>
<script src="/Scripts/bootstrap.js" type="text/javascript"></script>
<script src="/Scripts/Control.js" type="text/javascript"></script>
<link rel="Stylesheet" type="text/css" href="/Styles/ng-grid.min.css" />
<link rel="Stylesheet" type="text/css" href="/Styles/Style.css"/>
<title></title>
</head>
<body>
<form id="form1" runat="server" novalidate>
<div ng-app="myApp">
<table style="width: 100%; height: 100%">
<tr style="text-align: center; vertical-align: middle;width:100%">
<td style="width:50%;text-align:left">
First Name:
<input type="text" name="firstname" ng-model="FirstName"/>
</td>
<td style="width:50%;text-align:left">
Last Name:
<input type="text" name="lastname" ng-model="LastName"/>
</td>
</tr>
</table>
</div>
<div ng-controller="MyCtrl">
<div class="gridStyle" ng-grid="gridOptions"></div>
</div>
</form>
</body>
</html>
在我的模块的 Control.js 文件中,我注入了 ngGrid 的依赖项,在我的控制器中 MyCtrl
我初始化了 gridoptions variable.My js 代码如下
在我的Control.js中是这样的:
var app = angular.module("myApp", ["ngGrid"]);
app.controller('MyCtrl', function ($scope) {
$scope.myData = [{ name: "Moroni", age: 50 },
{ name: "Tiancum", age: 43 },
{ name: "Jacob", age: 27 },
{ name: "Nephi", age: 29 },
{ name: "Enos", age: 34}];
$scope.gridOptions = {
data:'myData'
};
$scope.$apply();
});
仅供参考,当我查看 http://angular-ui.github.io/ui-grid/ 中给出的示例时, console.And 中没有出现任何错误,如果我查看 plunker 中的代码,也会发生同样的事情(即我看不到任何网格)。
感谢任何帮助!!
您正在 ng-app
之外使用 MyCtrl
它应该在它的模块中。
这样试试
<div ng-app="myApp">
<div ng-controller="MyCtrl">
</div>
</div>
N:B :您不需要 $scope.$apply();
。
3 小时以来,我一直在尝试在 ng-grid 中显示 json 数据,但无法做到 it.I 已按照 ng 入门指南中给出的说明进行操作 - grid.But 无法显示网格中的数据。
在我的UserEdit.aspx页面中我的HTML代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UserEdit.aspx.cs" Inherits="SampleWebApp.UserEdit" %>
<!DOCTYPE html>
<html >
<head runat="server">
<script src="/Scripts/angular.js"></script>
<script src="/Scripts/jquery-1.9.1.js"></script>
<script src="/Scripts/ng-grid-2.0.14.min.js"></script>
<script src="/Scripts/bootstrap.js" type="text/javascript"></script>
<script src="/Scripts/Control.js" type="text/javascript"></script>
<link rel="Stylesheet" type="text/css" href="/Styles/ng-grid.min.css" />
<link rel="Stylesheet" type="text/css" href="/Styles/Style.css"/>
<title></title>
</head>
<body>
<form id="form1" runat="server" novalidate>
<div ng-app="myApp">
<table style="width: 100%; height: 100%">
<tr style="text-align: center; vertical-align: middle;width:100%">
<td style="width:50%;text-align:left">
First Name:
<input type="text" name="firstname" ng-model="FirstName"/>
</td>
<td style="width:50%;text-align:left">
Last Name:
<input type="text" name="lastname" ng-model="LastName"/>
</td>
</tr>
</table>
</div>
<div ng-controller="MyCtrl">
<div class="gridStyle" ng-grid="gridOptions"></div>
</div>
</form>
</body>
</html>
在我的模块的 Control.js 文件中,我注入了 ngGrid 的依赖项,在我的控制器中 MyCtrl
我初始化了 gridoptions variable.My js 代码如下
在我的Control.js中是这样的:
var app = angular.module("myApp", ["ngGrid"]);
app.controller('MyCtrl', function ($scope) {
$scope.myData = [{ name: "Moroni", age: 50 },
{ name: "Tiancum", age: 43 },
{ name: "Jacob", age: 27 },
{ name: "Nephi", age: 29 },
{ name: "Enos", age: 34}];
$scope.gridOptions = {
data:'myData'
};
$scope.$apply();
});
仅供参考,当我查看 http://angular-ui.github.io/ui-grid/ 中给出的示例时, console.And 中没有出现任何错误,如果我查看 plunker 中的代码,也会发生同样的事情(即我看不到任何网格)。
感谢任何帮助!!
您正在 ng-app
MyCtrl
它应该在它的模块中。
这样试试
<div ng-app="myApp">
<div ng-controller="MyCtrl">
</div>
</div>
N:B :您不需要 $scope.$apply();
。