角度服務問題

Question

我需要一些幫助來了解以下角度服務代碼中的錯誤。

編輯： 我有不同的js文件數控制器使用CRUD API像

$http.get('/api/sites/' + service.siteID) 

或只是需要變量指令像

templateUrl: '../../' + service.template + ' + '.html' 

所以我創造之間共享這些變量服務所有的js文件，而不是在每個文件中進行api調用。

這裏是服務

app.service('SharedData', function($http) { 

$http.get('config.json') 
    .success (function(data) { 
     var siteID = data._id; 
     console.log(siteID); // return 553e2d15f91e4bd75d000008 

     $http.get('/api/sites/' + siteID) 
      .success(function(site) { 
       var template = site.template; 
       console.log(template); // return myTemplate 
      }) 
      .error(function(data) { 
       console.log('Error: ' + data); 
      }) 
    }) 
    .error(function(data) { 
     console.log('Error: ' + data); 
    }) 

service = { 
    siteID : siteID, // return undefined instead of 553e2d15f91e4bd75d000008 
    template : template // return undefined instead of myTemplate      
    }; 

return service; 
}) 

我只想做一個精確的。如果我寫我的服務類似下面，它工作得很好，我的意思是值在所有控制器和指令以及通過

app.service('SharedData', function() { 
service = { 
    siteID : '553e2d15f91e4bd75d000008', 
    pageID : '553e2d15f91e4bd75d000009', 
    template : 'template1', 
    layout : 'home' 
    }; 

return service; 
}) 

非常感謝

編輯

我修改了服務爲遵循

app.factory('SharedData', function($http) { 
service = {}; 
$http.get('config.json') 
    .success (function(data) { 
     service.siteId = data._id; 
     //console.log(service.siteId); 

     $http.get('/api/sites/' + service.siteId) 
      .success(function(site) { 
       service.template = site.template; 
       //console.log(service.template); 
      }) 
    }) 
service.pageID = '553e2d15f91e4bd75d000009'; 
service.layout = 'home' 
return service 
}) 

在控制器的console.log（服務）與所有值返回一個對象：

layout: "home" 
pageID: "553e2d15f91e4bd75d000009" 
siteId: "553e2d15f91e4bd75d000008" 
template: "template1" 

console.log('Layout is ' + service.layout); // return home 
console.log('PageID is ' + service.pageID); // return 553e2d15f91e4bd75d000009 

但

console.log('siteID is ' + service.siteId); // return undefined !!!!! 
console.log('template is ' + service.template); // return undefined !!!!! 

不明白，請幫助

Answer 1

我得到這樣的幫助，從谷歌集團

「你讓你的信息異步簡單地說，信息是不是日尚未公佈。當你將它們註銷時。只有當$ http調用完成時，你才能獲得控制器中的信息。 在調試器屏幕中，服務是一個「實時」對象，因此它會被更新。該數據不是一個對象（在這一點上）並按照這樣記錄。 查看$ q服務中承諾如何在角度中工作。「

那麼這裏就是如何解決問題與$ Q

service = {}; 
    app.service('GetSiteID', function ($http) { 
     return $http.get('config.json') 
     .then (function(response) { 
      service.siteID = response.data._id 
      return service.siteID 
    }); 
}) 
app.service('GetTemplateAndPages', function (GetSiteID, $http, $q) { 
    return GetSiteID 
     .then(function(id) { 
     return $http.get('/api/sites/' + id) 
      .then (function(response) { 
       var data = response.data; 
       service.template = response.data.template; 
       service.pages = response.data.pages; 
       return service.template; 
       return service.pages 
     }) 
    }) 
}) 
app.service('SharedData', function (GetSiteID, GetTemplateAndPages, $q) { 
    return $q.all([GetSiteID, GetTemplateAndPages]) 
     .then (function(response) { 
     return service 
    }) 
}) 

然後用它在控制器像

app.controller('pagesController', function(SharedData, $scope, $http) { 
    SharedData.then(function(service) { 
     console.log(service); 
     console.log('Site ID is ' + service.siteID); 
     console.log('Template is ' + service.template); 
     console.log('Pages are ' + service.pages); 
    }) 
}); 

Answer 2

你的siteID變量在$ http.get方法的範圍之外引用。

定義的siteID功能上面，像這樣：

app.service('SharedData', function($http) { 
var siteID = ''; 
$http.get('config.json') 
    .success (function(data) { 
     siteID = data._id; 
     console.log(siteID); // return 553e2d15f91e4bd75d000008 

     $http.get('/api/sites/' + siteID) 
      .success(function(site) { 
       var template = site.template; 
       console.log(template); // return myTemplate 
      }) 
      .error(function(data) { 
       console.log('Error: ' + data); 
      }) 
    }) 
    .error(function(data) { 
     console.log('Error: ' + data); 
    }) 

service = { 
    siteID : siteID, // return undefined 
    template : template,      
    }; 

return service; 
}) 

Answer 3

您還沒有構造對象正確。您需要首先定義對象，然後賦值給對象的屬性：

app.service('SharedData', function($http) { 

var service = { 
    siteID : '', // return undefined 
    template : '',      
    }; 

$http.get('config.json') 
    .success (function(data) { 
     service.siteID = data._id; 
     console.log(siteID); // return 553e2d15f91e4bd75d000008 

     $http.get('/api/sites/' + siteID) 
      .success(function(site) { 
       service.template = site.template; 
       console.log(template); // return myTemplate 
       return service; 
      }) 
      .error(function(data) { 
       console.log('Error: ' + data); 
      }) 
    }) 
    .error(function(data) { 
     console.log('Error: ' + data); 
    }) 



}) 

我不完全相信你的正確理解應該如何利用該服務在你的控制器，所以這裏是一個小的演示我設置：

Services Demo