在部分页面中使用ng-grid

在部分页面中是否有任何使用ng-grid的示例。每当我尝试使用时，都会弹出一个错误消息，如TypeError: Cannot set property 'myData' of undefined。在部分页面中使用ng-grid

我App.js

'use strict'; 


// Declare app level module which depends on filters, and services 
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives', 'myApp.controllers', 'ngGrid']). 
    config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: 'MyCtrl1'}); 
    $routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: 'MyCtrl2'}); 
    $routeProvider.otherwise({redirectTo: '/view1'}); 
    }]);

Controller.js

'use strict'; 

/* Controllers */ 

angular.module('myApp.controllers', ['ngGrid']). 
    controller('MyCtrl1', [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', 
      columnDefs: [{ field: 'name', displayName: 'Name' }, 
       { field: 'age', displayName: 'Age', cellTemplate: '<div ng-class="{green: row.getProperty(col.field) > 30}"><div class="ngCellText">{{row.getProperty(col.field)}}</div></div>' }], 
      showGroupPanel: true 
     }; 
    }]) 
    .controller('MyCtrl2', [function() { 

    }]); 
//MyCtrl1.$inject = ['$scope'];

Partial1.html

<p>This is the partial for view 1.</p> 
<div class="gridStyle" ng-grid="gridOptions"></div> 
     <div style="clear:both"/> 
<p>{{ myData | json }}</p>

Partial2.html

<p>This is the partial for view 2.</p> 
<p> 
    Showing of 'interpolate' filter: 
    {{ 'Current version is v%VERSION%.' | interpolate }} 
</p>

和index.html

<!doctype html> 
<html xmlns:ng="http://angularjs.org" id="ng-app" lang="en" ng-app="myApp"> 
<head> 
    <meta charset="utf-8"> 
    <title>My AngularJS App</title> 
    <link rel="stylesheet" href="css/app.css"/> 
    <link rel="stylesheet" href="css/bootstrap.css"> 
    <link rel="stylesheet" href="css/ng-grid.css"> 
    <link rel="stylesheet" href="css/Style.css"> 

    <!-- In production use: 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script> 
    --> 
    <script src="js/jquery-1.9.1.min.js"></script> 
    <script src="lib/angular/angular.js"></script> 
    <script src="js/ng-grid-2.0.5.min.js"></script> 
    <script src="js/app.js"></script> 
    <script src="js/services.js"></script> 
    <script src="js/filters.js"></script> 
    <script src="js/directives.js"></script> 
    <script src="js/controllers.js"></script> 
</head> 
<body> 
    <ul class="menu"> 
    <li><a href="#/view1">view1</a></li> 
    <li><a href="#/view2">view2</a></li> 
    </ul> 

    <div ng-view></div> 

    <div>Angular seed app: v<span app-version></span></div> 
</body> 
</html>

能否请你说，为什么'myData'是不可用的Partial1.html？

在此先感谢。

来源

2013-05-10 Arnab Das

这可能太晚了，但是在这里的代码 {name：“Enos”，age：34}，]; 你不需要昏迷。它应该是： {name：“Enos”，age：34}];

来源

2013-06-27 16:21:33

在部分页面中使用ng-grid

回答

相关问题