AngularJS從nodejs獲取JSON API

-2

我收到了一些奇怪的問題。我的nodejs api與mongodb一起使用。 Angular通過JSON向nodejs請求數據。我使用Webstorm 11來啓動Angular App。在NG-重複每一個元素AngularJS從nodejs獲取JSON API

TypeError: Cannot read property '$id' of undefined 
    at arguments.(anonymous function) (chrome-extension://ighdmehidhipcmcojjgiloacoafjmpfk/dist/hint.js:2001:19) 
    at m.$digest (https://code.angularjs.org/1.5.0/angular.min.js:138:399) 
    at m.scopePrototype.$digest (chrome-extension://ighdmehidhipcmcojjgiloacoafjmpfk/dist/hint.js:2016:23) 
    at m.$apply (https://code.angularjs.org/1.5.0/angular.min.js:141:341) 
    at m.scopePrototype.$apply (chrome-extension://ighdmehidhipcmcojjgiloacoafjmpfk/dist/hint.js:2079:22) 
    at g (https://code.angularjs.org/1.5.0/angular.min.js:94:139) 
    at t (https://code.angularjs.org/1.5.0/angular.min.js:98:260) 
    at XMLHttpRequest.u.onload (https://code.angularjs.org/1.5.0/angular.min.js:99:297)

：所以，後來我做使用JSON NG-重複並獲得這樣的：

TypeError: Cannot read property '$id' of undefined 
    at arguments.(anonymous function) (chrome-extension://ighdmehidhipcmcojjgiloacoafjmpfk/dist/hint.js:2001:19) 
    at m.$digest (https://code.angularjs.org/1.5.0/angular.min.js:138:399) 
    at m.scopePrototype.$digest (chrome-extension://ighdmehidhipcmcojjgiloacoafjmpfk/dist/hint.js:2016:23) 
    at m.$apply (https://code.angularjs.org/1.5.0/angular.min.js:141:341) 
    at m.scopePrototype.$apply (chrome-extension://ighdmehidhipcmcojjgiloacoafjmpfk/dist/hint.js:2079:22) 
    at https://code.angularjs.org/1.5.0/angular.min.js:21:44 
     at Object.invoke (https://code.angularjs.org/1.5.0/angular.min.js:41:295) 
    at Ac.c (https://code.angularjs.org/1.5.0/angular.min.js:20:468) 
    at Object.Ac.ia.resumeBootstrap (https://code.angularjs.org/1.5.0/angular.min.js:21:357) 
    at maybeBootstrap (chrome-extension://ighdmehidhipcmcojjgiloacoafjmpfk/dist/hint.js:569:11)

這。結果頁面正常工作，但在控制檯中的這個錯誤並不好。

然後我試圖使用JSON： https://s3.amazonaws.com/codecademy-content/courses/ltp4/forecast-api/forecast.json

與此JSON不扔任何錯誤工作.. 所以這就是我如何知道我的JSON沒有「足夠好」：d也許我需要把一些種類的標題？在附加的圖片中，您可以比較我正在使用的JSON。

p.s.更奇怪的是：當我在瀏覽器中執行我的index.html文件而沒有webstorm（file：///Users/rustem/Dropbox/octomoney/index.html）時 - 控制檯中沒有錯誤，應用程序正常工作！

JSON的：

curl -i -X GET http://localhost:3000/getData?collection=expenses 
    HTTP/1.1 200 OK 
    X-Powered-By: Express 
    Access-Control-Allow-Origin: * 
    Content-Encoding: UTF-8 
    Content-Type: application/json; charset=utf-8 
    Content-Length: 1009 
    ETag: W/"3f1-Y7uhK30COBeAh0OJQ4Upzg" 
    Date: Fri, 19 Feb 2016 12:49:25 GMT 
    Connection: keep-alive 

    {"result":"1","message":"Request completed","data":[{"name":"Прочее","icon":"all_inclusive","color":"#b7cfd9","subCategories":"Ebay & Ali"},{"name":"Автомобиль","icon":"directions_car","color":"#63a3d2","subCategories":"Ремонт"}]} 


    curl -i -X GET https://s3.amazonaws.com/codecademy-content/courses/ltp4/forecast-api/forecast.json 
    HTTP/1.1 200 OK 
    x-amz-id-2: I2wao57Or1Ib/0Ox9Bp/g5xNrlqqxbK/7kti+YjugN3974z1soOeOMhH+e5mw2Pz 
    x-amz-request-id: 7B8334962BA70A53 
    Date: Fri, 19 Feb 2016 12:44:56 GMT 
    Expires: 0 
    Content-Encoding: UTF-8 
    Cache-Control: no-cache 
    Last-Modified: Mon, 26 Jan 2015 16:20:44 GMT 
    ETag: "f059fbba22678ca58a51d7b8d1e99061" 
    Accept-Ranges: bytes 
    Content-Type: application/json 
    Content-Length: 946 
    Server: AmazonS3 

    { 
    "city_name": "New York", 
    "country": "US", 
    "days": [ 
    { 
    "datetime": 1420390800000, 
    "icon": "https://s3.amazonaws.com/codecademy-content/courses/ltp4/forecast-api/sun.svg", 
    "high": 68, 
    "low": 37 
    }, 
    { 
    "datetime": 1420736400000, 
    "icon": "https://s3.amazonaws.com/codecademy-content/courses/ltp4/forecast-api/sun.svg", 
    "high": 59, 
    "low": 32 
    }

我如何使用NG-重複：

<body ng-app="octomoney"> 
    <div> 
     <div ng-controller="getExpensesController"> 
      <div ng-repeat="expense in expenses.data" align="center"> 
       <h4>{{ expense.name }}</h4> 
      </div> 
     </div> 
    </div> 

    <script src="https://code.angularjs.org/1.5.0/angular.min.js"></script> 
    <script src="js/app.js"></script> 
    <script src="js/controllers/mainController.js"></script> 
    <script src="js/services/getExpensesService.js"></script> 
    </body>

app.js：

var app = angular.module('octomoney', []);

個mainController.js：

app.controller('getExpensesController', ['$scope', 'getExpensesService', function ($scope, getExpensesService) { 
     getExpensesService.success(function (data) { 
      $scope.expenses = data; 
     }); 
    }]);

getExpensesService.js：

app.factory('getExpensesService', ['$http', function ($http) { 
     //return $http.get('https://s3.amazonaws.com/codecademy-content/courses/ltp4/forecast-api/forecast.json') 
      return $http.get('http://localhost:3000/getData?collection=expenses&queryBuilder=1==1') 
      .success(function (data) { 
       return data; 
      }) 
      .error(function (err) { 
       return err; 
      }); 
    }]);

來源

2016-02-19 rustemk

我沒有看到附圖。將我們的HTML鏈接到您執行ng-repeat的位置，您的json文件的一部分以檢查dara格式，以及如何將其加載到控制器中 – Walfrat

此錯誤背後的原因是...您已在getExpensesController中注入了getExpensesService，但您havnt在angular.module中添加ExpensesService模塊（'octomoney'，[]）; – Banik

@Banik不，沒有幫助。再次，與另一個JSON工作正常（沒有錯誤）。 – rustemk

想通了，AngularJS Batarnang導致此問題。

詳情在這裏：https://github.com/angular/batarang/issues/285

來源

2016-02-20 04:27:42 rustemk

AngularJS從nodejs獲取JSON API

回答

相關問題