How to implement a stateful proxy in angular js?

Question

export default function appState($q, $rootScope, StateService, DateService, filterState) {

var state = {
    dates: [],
    type: StateType.NOTLOADED
};

function _stateChange(type) {
    if(type instanceof StateType) {
        $rootScope.$broadcast(type.name);
        state.type = type;
    }
}

function _getDates() {
    let deferred = $q.defer();
    if(!state.dates.length) {
        DateService.getAll().then(function(result) {
            state.dates = result;
            deferred.resolve();
        });
    } else {
        console.log('no data needed');
        deferred.resolve();
    }
    return deferred.promise;
}

function init() {
    _getDates().then(function() {
        console.log(state.dates);
    });
}

if(state.type == StateType.NOTLOADED)
    init();

return {
    getDates: _getDates
}
}

I'm trying to implement a state pattern for an angular application.

I want to only load different state properties when they're needed or when a state change occurs.

If nothing has been loaded yet I want to load the data, otherwise I want to return the result immediately.

Whenever I return a promise I get an undefined error. I have no idea what I'm doing wrong.

The state object is being instantiated as a factory.

import angular from 'angular';
import appState from './app.state.js';

export default function() {
    angular.module('app').factory('appState', appState);
}