Question

我正在使用AngularJs在ASP MVC框架之上创建SPA。在我启用HTML5模式以生成更好的URL之前，我一切都运行良好。现在没有加载图像。

似乎对my / Images文件夹的任何请求都没有进入服务器。我已经使用Fidler来检查流量，并且可以看到部分的所有请求，但没有任何图像请求。

这是我的AngularJs路线

$stateProvider.
      state({
          name: 'home',
          url: '/',
          templateUrl: '/app/public/partials/index.html'
      }).
      state({
          name: 'infoprivacy',
          url: '/info/privacy',
          templateUrl: '/app/public/partials/info/privacy.html'
      }).
      state({
          name: 'infocookie',
          url: '/info/cookie',
          templateUrl: '/app/public/partials/info/cookie.html'
      }).
      state({
          name: 'infoterms',
          url: '/info/terms',
          templateUrl: '/app/public/partials/info/terms.html'
      }).
      state({
          name: 'groups',
          url: '/groups',
          templateUrl: '/app/public/partials/groups/index.html'
      }).
      state({
          name: 'groupsview',
          url: '/groups/view/:id',
          templateUrl: '/app/public/partials/groups/view.html'
      }).
      state({
          name: 'jobs',
          url: '/jobs',
          templateUrl: '/app/public/partials/jobs/index.html',
          controllr: 'JobsCtrl'
      }).
      state({
          name: 'jobsview',
          url: '/jobs/view/:id',
          templateUrl: '/app/public/partials/jobs/view.html'
      }).
      state({
          name: 'jobsnotfound',
          url: '/jobs/notfound',
          templateUrl: '/app/public/partials/jobs/notfound.html'
      }).
      state({
          name: 'login',
          url: '/login',
          templateUrl: '/app/public/partials/login.html'
      }).
      state({
          name: 'error',
          url: '/error/:errorRef',
          templateUrl: '/app/public/partials/error.html'
      }).
      state({
          name: 'cvs',
          url: '/cvs',
          templateUrl: '/app/public/partials/cvs/index.html'
      }).
      state({
          name: 'cvsedit',
          url: '/cvs/edit/:id',
          templateUrl: '/app/public/partials/cvs/edit.html'
      }).
      state({
          name: 'cvsedit.withdlg',
          url: '/:dlg',
          templateUrl: '/app/public/partials/cvs/edit.html'
      }).
      state({
          name: 'profile',
          url: '/profile',
          templateUrl: '/app/public/partials/profile/index.html'
      });

  $urlRouterProvider.when('', '/');

  $locationProvider.html5Mode(true).hashPrefix('!');

这是未加载的背景图片的CSS

#menu .item.navProfile {
    background: url(/Images/icon-nav-profile.png) right 20px no-repeat;
}

使用ng-include

加载包含菜单的HTML

Answer 1

有一个名为Batarang的chrome开发人员工具的插件，这将有助于调试Angular JS问题。

AngularJs HTML5模式无法加载图片

1 个答案: