Question

我正在使用Angular 1.5.6并使用AngularUI路由器（https://github.com/angular-ui/ui-router）。我有不同的路线，例如客户和用户。在这些中，每个都有不同的“根”。例如一个用于列表，一个用于edt。我在这里设置客户路线：

import customerListModule from './list/customer.list';
import customerServiceModule from './services/customer.service';
...
...

function customerModule($stateProvider, $urlRouterProvider) {
    'ngInject';

    $urlRouterProvider
        .when('/customer', ['$state', function($state) {
            $state.go('customer.list.tracked');
        }]);

    $stateProvider
        .state('customer', {
            parent: 'root',
            url: '/customer',
            abstract: true,
            views: {
                'root@app': {
                    template: '<div class="customer" ui-view=""></div>'
                }
            },
            onEnter: () => {
                // in here I want to change my customer servce
            },
        })
        .state('customer.list', {
            url: '',
            views: {
                '@customer': {
                    template: '<customer></customer>'
                }
            },
            breadcrumbs: {
                name: 'customer.breadcrumbs.list'
            },
            params: {
                saving: false
            }
        })
        .state('customer.edit', {
            parent: 'customer.list',
            url: '/:id/edit',
            views: {
                '@customer': {
                    template: editTemplate(),
                    controller: manageCustomerCtrl,
                    controllerAs: 'manageCustomerVM'
                }
            },
            breadcrumbs: {
                name: 'customer.breadcrumbs.edit'
            },
            resolve: {
                isAuthorized: 'readWriteAccess'
            },
            bodyClass: 'product-form'
        });
}

export default angular.module('customerAdminUI.customer', [
        'ui.bootstrap',
        'ui.router',
        customerListModule.name,
        customerServiceModule.name,
        ...
        ...
    ])
    .config(customerModule);

我有一个客户服务，我想在客户状态的onEnter回调中访问。我试着将它注入customerModule方法，以便我可以在onEnter（）回调中使用它：

function customerModule($stateProvider, $urlRouterProvider, CustomerService) {

    ...
    ...


    $stateProvider
        .state('customer', {
            parent: 'root',
            url: '/customer',
            abstract: true,
            views: {
                'root@app': {
                    template: '<div class="customer" ui-view=""></div>'
                }
            },
            onEnter: () => {
                CustomerService.clearSearch();
            },
        })

然而我收到错误：

Unknown provider: CustomerService

如何在onEnter回调中使用服务？

Answer 1

我们可以要求服务作为参数

// not ready for minification
onEnter: function(CustomerService) {
   CustomerService.dowhatneeded...
},

// preferred way
onEnter: ['CustomerService', function(service) {
   service.dowhatneeded...
}],

访问AngularUI Router onEnter回调中的服务

1 个答案: