使用状态模板中的Angular组件共享ui-router解析数据

Question

在我的角度应用中，我有一个非常标准的<navbar>组件。

这个组件将在模板中用于我使用ui-router定义的以下状态：

$stateProvider
    .state('proverbs', {
        abstract: true,
        url: '/proverbs/:lang',
        template: '<navbar></navbar><div ui-view class="absolute full-sized anim-in-out" data-anim-speed="444" data-anim-sync="false"/></div>',
        resolve: {
            proverbs: ['$stateParams', '$q', 'dataFactory', function ($stateParams, $q, dataFactory) {
                let deferred = $q.defer();
                let url = CONFIG.api + '/proverbs/' + $stateParams.lang;

                dataFactory.getData(url).then(function (data) {
                    deferred.resolve(data);
                });

                return deferred.promise;
            }]
        }
    })

正如您所看到的，我设置了一个resolve属性，以便能够与此状态及其所有子状态共享异步数据。

但是，组件<navbar>在初始化时不知道proverbs是什么：

(function() {
'use strict';

    angular
        .module('proverbial')
        .component('navbar', {
            templateUrl:'scripts/components/navbar/navbar.template.html',
            controller: NavbarController,
            bindings: {
                Binding: '=',
            },
        });

    NavbarController.$inject = [ '$stateParams', '$scope', 'language', 'proverbs', 'CONFIG' ];

    function NavbarController( $stateParams, $scope, language, proverbs, CONFIG ) { };
})();

访问状态时出现以下错误：

Error: [$injector:unpr] Unknown provider: proverbsProvider <- proverbs

如何在不调用proverbs的情况下访问navbar组件中的dataFactory数据？