main.js

Question

我正在尝试使用从REST服务提供的数据进行ng-repeat迭代。我设法恢复main.js文件中的数据，但是我无法将数据注入到HTML中。

我刚开始学习nodejs和angular，所以我很可能没有明白它。我正在记录两次对REST服务的调用，在其中一个中获取数据（使用回调函数）并在另一个中获取一个承诺（我认为这是因为调用是同步的，我没有使用任何回调函数在这里。）

我不明白为什么HTML无法获取数据。

无论如何，这里的代码是：

main.js

var myApp = angular.module('myApp', ['ngResource']);

myApp.factory('restservice', function ($resource) {
    var source = $resource(
        "http://rest-service.guides.spring.io/greeting/");
    var data =source.get({},function(){
      //this log shows the data
     console.log (data); 
    })

    return data;
});

function AvengersCtrl($scope, $resource, restservice) {
    $scope.servicedata = restservice;
    //this log shows the promise
    console.log($scope.servicedata);
}

的index.html

<!DOCTYPE html>
<html>
<head>
  <title>AngularJS Tutorials</title>
  <!-- <link rel="stylesheet" href="vendor/foundation/foundation.min.css"> -->
</head>

<body>

  <div ng-app="myApp">
    <div ng-controller="AvengersCtrl">
      <input type="text" ng-model="search.$">
      <table>
        <tr ng-repeat="resource in servicedata | filter:search">
            <td>{{resource.id}}</td>
            <td>{{resource.content}}</td>
        </tr>
      </table>
    </div>
  </div>

  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular.min.js"></script>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.3/angular-resource.js"></script>
  <script type="text/javascript" src="/angular/app/main.js"></script>
</body>
</html>

提前致谢，问候

Answer 1

代码对我来说很好。

问题是服务返回一个Json对象而不是list。

如果用这样的列表包装它，你会看到结果

$scope.servicedata = [restservice];

简单的角度示例不起作用：ng-repeat + $ resource + GET

main.js

的index.html

1 个答案: