將數據從Express傳輸到Angular

您能幫我嗎？我最近一直在努力學習角度，並且提出了這個小問題，我無法在簡單的角度應用中顯示來自服務器的數據。將數據從Express傳輸到Angular

我創建了一個快速本地主機服務器，並在我的服務器的文件夾中有一個包含3個.js文件的文件夾，其中包含我的應用程序的數據。讓我們只是說其中之一被稱爲「菜單」，幷包含具有諸如「名稱」，「價格」，「成分」等屬性的對象的數組。

module.exports = [ 
{ 
    id: 1, 
    name: 'Margherita', 
    ingredients: [1, 2], 
    price: 14.90 
}, 
{ 
    id: 2, 
    name: 'Funghi ', 
    ingredients: [1, 2, 3], 
    price: 16.90 
}, 
{ 
    id: 3, 
    name: 'Vesuvio', 
    ingredients: [1, 2, 4], 
    price: 17.90 
}];

發射端口服務器之後：8080在我的網頁瀏覽器我打字：「本地主機：8080 /菜單」，我有我的所有對象的視圖。

現在在我的角度應用程序我創建了一個服務

app.factory('menu', ['$http', function($http) { 
return 
$http.get('http://localhost:8080/menu') 
     .success(function(data) { 
      return data; 
     }) 
     .error(function(err) { 
      return err; 
     }); 
    }]);

，並注射到我的MainController.js

app.controller('MainController', ['$scope','menu', function($scope, menu) { 
    $scope.today = new Date(); 

    menu.success(function(data){ 
    $scope.pizzaMenu = data; 
    }); 

}]);

的index.html

<div class="appetizers row" ng-repeat="pizza in pizzaMenu.module.export"> 
      <div class="item col-md-9"> 
      <h3 class="name"> {{pizza.name}} </h3> 
      <p class="description"> {{pizza.ingredients}} </p> 
      </div> 
      <div class="price col-md-3"> 
      <p class="price"> {{pizza.price}} </p> 
      </div> 
     </div>

什麼是錯的用我的想法和我的代碼？

親切的問候， Mikolaj

來源

2016-02-02 Mikołaj Junik

是否有您遇到的實際問題？您是否在瀏覽器的控制檯中查找錯誤？ – Phil

@Phil CONSOL日誌顯示「XMLHttpRequest無法加載http：// localhost：8080/menu.No'Access-Control-Allow-Origin'標題出現在請求的資源上，因此不允許Origin'null'的訪問「 –

搜索那個錯誤信息，你會發現許多重複的問題，並帶有很好的答案 – Phil

我相信問題是，你使用jQuery類型的回調語法。您需要使用.then而不是.success和.catch而不是.error。

app.factory('menu', ['$http', function($http) { 
return $http.get('http://localhost:8080/menu').catch(function(data) { 
    console.log(data); 
    throw data; 
}); 

}]); 



menu.then(function(data){ 
    $scope.pizzaMenu = data; 
});

來源

2016-02-02 00:36:05 bluetoft

不要拋棄那樣的錯誤，否則承諾將被視爲*解決*。 – Phil

@Phil很好的呼叫thx。 – bluetoft

你也可以'返回$ q.reject（data）'保持拒絕承諾 – Phil

將數據從Express傳輸到Angular

回答

相關問題