0

在 ngRoute 中使用参数并直接访问 URL(不是通过站点内的链接)时,不会加载 CSS。我的所有路线都运行良好,除了/chef/:id. 我使用了 yeoman 的angular generator,我正在使用grunt serve.

这是我的路线代码:

   angular
    .module('agFrontApp', [
        'configuration',
        'LocalStorageModule',
        'ngCookies',
        'ngRoute',
        'ngSanitize',
        'ngTouch'
    ])
    .config(function ($routeProvider, $locationProvider) {
        $routeProvider
            .when('/', {
                templateUrl: '../views/main_view.html',
                controller: 'MainCtrl',
                controllerAs: 'MainCtrl',
            })
            .when('/login', {
                templateUrl: '../views/login_view.html',
                controller: 'LoginCtrl',
                controllerAs: 'login',
            })
            .when('/chefs', {
                templateUrl: '../views/chef_list_view.html',
                controller: 'ChefListController',
                controllerAs: 'chefs',
            })
            .when('/chef/:id', {
                templateUrl: '../views/chef_detail_view.html',
                controller: 'ChefDetailController',
                controllerAs: 'chef'
            })
            .when('/receitas', {
                templateUrl: '../views/recipe_list_view.html',
                controller: 'RecipeListController',
                controllerAs: 'recipe'
            })
            .when('/perfil', {
                templateUrl: '../views/perfil_view.html',
            })
            .otherwise({
                redirectTo: '/'
            });
        $locationProvider.html5Mode(true);

    });

这是控制器/chef/:id

'use strict';

(function() {

function ChefDetailController($routeParams, $scope, $log, Chefs)  {
    var vm = this;

    Chefs.getChef($routeParams.id)
        .then(function(data) {
            $log.log('success');
        })
        .fail(function(data) {
            $log.log('something went wrong');
        });
}

angular.module('agFrontApp')
    .controller('ChefDetailController',
        [ '$routeParams', '$scope', '$log', 'Chefs', ChefDetailController]);

})();

我究竟做错了什么?

编辑:

这是 chef_detail_view.html:http ://pastebin.com/bL5ST01N

4

1 回答 1

2

你很可能使用这样的相对 url 加载你的 CSS

<link rel="stylesheet" href="styles/style.css" />

问题出在 html5mode 中,您的主厨 url 是/chef/123因此浏览器正在尝试从中加载您的 CSS /chef/styles/style.css您需要关闭 html5mode 或将样式表 href 更改为 root relative(例如/styles/style.css

于 2014-09-25T15:08:26.973 回答