Разделите разрешение в Угловом UI-маршрутизаторе

Question

У меня есть разные состояния, которые используют ту же самую решимость, чтобы загрузить timeLog в мой контроллер $ scope до загрузки контроллера. Я бы не хотел воспроизводить этот код, но поделился им между этими взглядами. Я довольно новичок в JS-фреймворках, и особенно в Angular JS.

Мне тяжело заниматься поиском в Интернете и не находить достойной информации. Возможно, я искал неправильно или не думал об этом правильно. Какие-либо предложения?

.config(function($stateProvider) { 
$stateProvider 
.state('tab.edit-log-summary', { 
    url: '/logs/edit-log-summary/:timeLogId', 
    views: { 
     'tab-logs': { 
     templateUrl: 'templates/logs/edit-log-summary.html', 
     controller: 'EditLogSummaryCtrl' 
     } 
    }, 
    resolve: { 
     timeLog: function(config, $stateParams, DailyLog) { 
     return DailyLog.get({id: $stateParams.timeLogId}); 
     }, 
    } 
    }) 

    .state('tab.edit-time-log', { 
    url: '/logs/edit-time-log/:timeLogId', 
    views: { 
     'tab-logs': { 
     templateUrl: 'templates/logs/edit-time-log.html', 
     controller: 'EditTimeLogCtrl' 
     } 
    }, 
    resolve: { 
     timeLog: function(config, $stateParams, DailyLog) { 
     return DailyLog.get({id: $stateParams.timeLogId}); 
     }, 
    } 
    }) 

}) 

Answer 1

Это действительно идет на ванильный Javascript. Решающими являются объекты. Просто определите их как один объект где-то выше и передайте его в свойство разрешения каждый раз.

.config(['$stateProvider',function($stateProvider) { 
var timeLogResolve = { 
     timeLog: ['config','$stateParams','DailyLog',function(config, $stateParams, DailyLog) { 
     return DailyLog.get({id: $stateParams.timeLogId}); 
     }] 
    }; 

$stateProvider 
.state('tab.edit-log-summary', { 
    url: '/logs/edit-log-summary/:timeLogId', 
    views: { 
     'tab-logs': { 
     templateUrl: 'templates/logs/edit-log-summary.html', 
     controller: 'EditLogSummaryCtrl' 
     } 
    }, 
    resolve: timeLogResolve, 
    } 
    }) 

    .state('tab.edit-time-log', { 
    url: '/logs/edit-time-log/:timeLogId', 
    views: { 
     'tab-logs': { 
     templateUrl: 'templates/logs/edit-time-log.html', 
     controller: 'EditTimeLogCtrl' 
     } 
    }, 
    resolve: timeLogResolve, 
    } 
    }) 

}]) 

Одно использование suggestion- inline array notation для обеспечения зависимостей. Это помогает защитить ваш код от взлома, если вы его минимизируете. Я сделал это сам в демо выше, но я оставляю это на свое усмотрение, чтобы сохранить его.