Question

我需要一些帮助才能理解以下角度服务代码中的错误。

编辑：我在使用CRUD API的不同js文件中有很少的控制器，如

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

或者只需要像

这样的变量指令

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

所以我创建了一个服务来在所有js文件之间共享这些变量，而不是在每个文件中进行api调用。

这是服务

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
})

非常感谢

修改

我已按照以下方式更改服务

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（service）中返回一个具有所有值的对象：

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

但

.css

请不要理解请帮助

Answer 1

您的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 2

您没有正确构建对象。您需要先定义对象，然后将值分配给对象属性：

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

Answer 3

我从Google Group获得此帮助

＆＃34;您正在异步获取信息。简单地说，这些信息在您注销时尚未提供。只有当$ http电话完成后才能完成。您将获得控制器中提供的信息。在调试器屏幕中，服务是“直播”。对象，所以它得到更新。数据不是对象（在那一点上）并且是这样记录的。看看有关承诺如何在角度中工作的$ q服务。＆＃34;

接下来是如何解决$ 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);
   })
});

角度服务问题

3 个答案: