Question

我有一个AngularJS 1.6.3应用程序，我遇到$q.all()无法正确解析的问题。我的配置（resolve）中的sessionService.initializeApp()函数似乎根本没有被调用。

未运行console.log()语句，并且未发出网络请求。但是，如果我将sessionService.initializeApp()更改为仅变量而不是带有返回的函数调用（即var initializeApp = return $q.all(...)），并且只需在sessionService.initializeApp中调用resolve，则网络发出了请求，但console.log()语句没有运行，控制器也没有实例化。

我觉得我正确地回复了承诺，但显然有些事情是错误的，因为决心实际上并没有解决。这里有什么想法吗？

app.config.js

//more code above...
.when('/dashboard', {
    slug: 'dashboard',
    templateUrl: 'app/dashboard/dashboard.html',
    controller: 'DashboardController',
    options: {
        title: 'Dashboard'
    },
    resolve: {
        appReady: function(sessionService) {
            console.log('resolving...');
            return sessionService.initializeApp();
        }
    }
})
//more code below...

session.service.js

//more code above...
var state = {
    appReady: false,
    loading: false,
    data: {}
};

var service = {
    initializeApp: initializeApp,
    getData: getData,
    setData: setData
};

function initializeApp() {
    return $q.all({
        user: ajaxService.get('SupplierService.svc/me', {}),
        states: ajaxService.get('SupplierService.svc/states', {}),
        utilityTypes: ajaxService.get('SupplierService.svc/utilities/types', {}),
        roles: ajaxService.get('SupplierService.svc/contacts/types', {})
    }).then(function(response) {
        setData('user', response.user['data']);
        setData('states', response.states['data']);
        setData('utilityTypes', response.utilityTypes['data']);
        setData('roles', response.roles['data']);
    }).catch(function(e) {
        console.log(e);
    }).finally(function() {
        state.appReady = true;
    });
}

function getData(key) {
    if (key) {
        return state.data[key];
    } else {
        return state.data;
    }
}

function setData(key, val) {
    state.data[key] = val;
}

return service;
//more code below...

dashboard.controller.js

//more code above...
function DashboardController($q, ajaxService, sessionService) {
    console.log('dashboard...');
});
//more code below...

Answer 1

从控制器而不是服务中捕获承诺。在服务中只返回$q.all

//more code above...
var service = {
    initializeApp: initializeApp
};

function initializeApp() {
    return $q.all({
        user: ajaxService.get('SupplierService.svc/me', {}),
        states: ajaxService.get('SupplierService.svc/states', {}),
        utilityTypes: ajaxService.get('SupplierService.svc/utilities/types', {}),
        roles: ajaxService.get('SupplierService.svc/contacts/types', {})
    })

}
return service;

抓住控制器中的承诺

function DashboardController($q, ajaxService, sessionService,setData) {
    sessionService..then(function(response) {
        setData('user', response.user['data']);
        setData('states', response.states['data']);
        setData('utilityTypes', response.utilityTypes['data']);
        setData('roles', response.roles['data']);
    }).catch(function(e) {
        console.log(e);
    }).finally(function() {
        state.appReady = true;
    });
});

Answer 2

目前，我已放弃使用resolve并刚刚修改sessionService.initializeApp()来检查应用是否准备就绪，如果是，请立即返回已解决的承诺，以便我不要＃39; t必须从服务器重新获取资源。

function initializeApp() {
    if (isAppReady()) {
        return $q.when('appReady');
    }

    return $q.all({
        user: ajaxService.get('SupplierService.svc/me', {}),
        states: ajaxService.get('SupplierService.svc/states', {}),
        utilityTypes: ajaxService.get('SupplierService.svc/utilities/types', {}),
        roles: ajaxService.get('SupplierService.svc/contacts/types', {})
    }).then(function(response) {
        setData('user', response.user['data']);
        setData('states', response.states['data']);
        setData('utilityTypes', response.utilityTypes['data']);
        setData('roles', response.roles['data']);
    }).catch(function(e) {
        console.log(e);
    }).finally(function() {
        setAppReady(true);
    });
}

然后在我的控制器中，我只是这样做：

sessionService.initializeApp().then(function() {
    //do stuff
});

AngularJS $ q.all（）不在路线中解析

2 个答案: