Question

我想将<base href="... href属性的值添加到所有get {和$http调用中。我尝试使用请求拦截器如下：

angular.module('curriculumModule', ['ng', 'ngRoute', 'curriculumControllerModule', 'directiveModule'])
.config(function($routeProvider, $httpProvider) {

    $httpProvider.defaults.headers.common['Content-Type'] = 'application/json';
    $httpProvider.defaults.headers.common['X-Ajax'] = 'true';

    $httpProvider.interceptors.push(function ($q) {
        return {
            'request': function (config) {
                config.url = $('base').attr('href') + '/' + config.url;
                return config || $q.when(config);
            }
        };
     });    

    $routeProvider
    .when('/view/:id', {controller: 'ViewCurriculumCtrl', templateUrl: 'view.html'})
    .when('/new', {controller: 'CreateCurriculumCtrl', templateUrl: 'new.html'})
    .when('/edit/:id', {controller: 'EditCurriculumCtrl', templateUrl: 'edit.html'})
    .when('/:curriculumId/workExperience/new', {controller: 'NewWorkExperienceCtrl', templateUrl: 'workExperiencesNew.html'})
    .when('/:curriculumId/workExperience/edit/:id', {controller: 'EditWorkExperienceCtrl', templateUrl: 'workExperiencesEdit.html'})
    .when('/:curriculumId/training/new', {controller: 'NewTrainingCtrl', templateUrl: 'trainingsNew.html'})
    .when('/:curriculumId/training/edit/:id', {controller: 'EditTrainingCtrl', templateUrl: 'trainingsEdit.html'})
    .otherwise({redirectTo:'/view/:id'});
});

但是，不知何故，AngularJs还将base href属性的值预先添加到我不想要的templateUrls中。

我该如何防止这种情况？

Answer 1

angular使用$ http服务来加载模板，这就是为什么你的拦截器会破坏模板网址的原因。我强烈建议你以不同的方式修改网址 - 在你调用$ http服务之前，而不是作为拦截器。

一个简单的包装器服务应该这样做，例如：

angular.module('curriculumModule').service('curHttp', ['$http', function($http) {

   this.http = function(params) {
     params.url = $('base').attr('href') + '/' + params.url;
     return $http(params);

}]);

AngularJS请求拦截器给我的templateUrl视图解析带来麻烦

1 个答案: