将JSON数据从角度服务传递到控制器中的范围数组

Question

我正在尝试使用ng-grid显示数据表。 但是，我对如何将数据放入角度数组进行显示感到困惑，如从angular-ui的示例所示，这是要走的路。 以下是为Rails api调用定义的服务

  app.factory('ProviderMedicalService', ['$resource', function($resource) {
     function ProviderMedicalService() {
       this.service = $resource('/api/provider_medical_services/:providerMedicalServiceId',      {providerMedicalServiceId: '@id'});
     };
     ProviderMedicalService.prototype.all = function() {
       return this.service.query();
     };
   return new ProviderMedicalService;
 }]);

此代码段摘自一个将rails与angular集成在一起的教程。 $resource是通过自定义rails api调用生成的json数据。 我假设return new ProviderMedicalServices返回json数据

(function() {
 app.controller('ModalDemoCtrl', ['$scope', 'ProviderMedicalService', '$resource', '$modal', function($scope, ProviderMedicalService, $resource, $modal) {
$scope.provider_medical_services = ProviderMedicalService.all();

在包装表的控制器中，教程指出$scope.provider_medical_services可帮助我们以后扩展api。

目前我的json数据可以正常显示，只是由于我的设置未将其格式化为表格格式。下面的代码正是我想要尝试的代码，并且我理解数据应该在传递给的控制器内部数组

<div class="gridStyle" ng-grid="gridOptions">
  <ul>
   <li ng-repeat="service in provider_medical_services">
    <p>{{service.name}}  {{service.cash_price | currency}} {{service.average_price |   currency}}</p>
    <p></p>
    <p></p>
   </li>
  </ul>
</div>

基本上，我的问题是我如何像这样的示例从工厂传递到数组中？

  $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' };
})

编辑图片，因为无法在评论中发布图片

在此处输入图片说明

Answer 1

我猜是这样

$scope.gridOptions = { data: 'myData' };

你会想要

$scope.gridOptions = { data: 'provider_medical_services'};

Answer 2

我将通过示例传递工厂数据

Javascript：

fruit = angular.module("fruit", []);

fruit.factory("Fruit", function() {
  return {
    fruits: [
      {name: "Bananas", description: "Yellow and peely"}, 
      {name: "Canteloupe", description: "Tell if its ripe by smelling them"}, 
      {name: "Cherries", description: "Dont try to make jam out of sweet ones"}, 
      {name: "Strawberries", description: "Picking them is murder on your back"},
      {name: "Tomatoes", description: "People used to think they were poisonous" }
     ]
  };
});


fruit.controller("FruitCtrl", function($scope, Fruit) {
  $scope.fruits = Fruit.fruits;
});

HTML：

<!DOCTYPE html>
<html ng-app="fruit">
<head>
<meta name="description" content="Factory example" />
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<script src="http://getbootstrap.com/2.3.2/assets/js/bootstrap.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body ng-controller="FruitCtrl">
  <ul>
    <li ng-repeat="fruit in fruits">{{fruit.name}}</li>
  </ul>
</body>
</html>

根据OP的以下评论进行编辑：

例如：

fruit.factory('Fruit', function($resource){
    return $resource('http://localhost/folder1/fruitData.json');
});

还需要在angular模块中注入['ngResource']的依赖项

也尝试一下：

[要使用$ resource服务处理数组，可以使用查询方法]

  var fruitData= $resource('http://localhost/folder1/fruitData/');
    $scope.items = fruitData.query();

将JSON数据从角度服务传递到控制器中的范围数组

问题描述

2 个解决方案

解决方案1
0 2014-07-08 22:42:52

解决方案2
0 2014-07-08 23:24:03

将JSON数据从角度服务传递到控制器中的范围数组

问题描述

2 个解决方案

解决方案1 0 2014-07-08 22:42:52

解决方案2 0 2014-07-08 23:24:03

解决方案1
0 2014-07-08 22:42:52

解决方案2
0 2014-07-08 23:24:03