Угловое приложение теряет дизайн и javascript при обновлении браузера (Chrome)

Question

Я работаю над своим первым приложением Angular.js, и он работает хорошо, но у меня постоянно возникают две проблемы с обновлением браузера. Я прикрепил ссылку на скринкаст, который показывает проблему. Две проблемы:

1. Когда я нажимаю кнопку обновления или ctrl-f5, страница теряет все стили CSS.
2. Когда я нажимаю ссылку «Календарь», чтобы вернуться на домашнюю страницу, такие вещи, как имя пользователя, показывают, когда они этого не делают. Посмотрите на скринкаст здесь: Problem on screencast

Вот моя маршрутизация:

'use strict'; 

var JBenchApp = angular.module('JBenchApp', [ 
    'ngRoute' 
]); 

JBenchApp.config(['$routeProvider', '$locationProvider', 
    function ($routeProvider, $locationProvider) { 
     $routeProvider. 
     when('/dashboard', { 
      templateUrl: 'partials/dashboard.html', 
      controller: 'JBenchCtrl' 
     }). 
     when('/calendar', { 
      templateUrl: 'partials/calendar.html', 
      controller: 'JBenchCtrl' 
     }). 
     when('/', { 
      templateUrl: 'partials/calendar.html', 
      controller: 'JBenchCtrl' 
     }). 
     when('/documents/:number', { 
      templateUrl: 'partials/documents.html', 
      controller: 'CaseDetailCtrl' 
     }). 
     when('/parties/:number', { 
       templateUrl: 'partials/parties.html', 
       controller: 'CaseDetailCtrl' 
     }). 
     otherwise({ 
      redirectTo: '/calendar' 
     }); 

     $locationProvider.html5Mode(true); 

    }]); 

EDIT ДОБАВИТЬ web.config ФАЙЛА ЧАСТЬ:

<rewrite> 
    <rules> 
     <rule name="Main Rule" stopProcessing="true"> 
     <match url=".*" /> 
     <conditions logicalGrouping="MatchAll"> 
      <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> 
      <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> 
     </conditions> 
     <action type="Rewrite" url="/index.html" /> 
     </rule> 
    </rules> 
      <rewriteMaps> 
       <rewriteMap name="/JWB/" /> 
      </rewriteMaps> 
    </rewrite> 

Любая идея, как сделать этот вопрос уходи?

Answer 1

Это происходит потому, что в браузер, вы теперь запрашиваете страницу в /некоторый/пути/, и если у вас есть какие-либо относительные ссылки в ваших дорожках активов, браузер будет искать их на /некоторые/путь/js/foo.js вместо /js/foo.js.

Существует несколько способов исправить это, но самым простым может быть просто использование абсолютных путей.

src="/js/foo.js" 

Иногда, однако, это не сработает из-за размещения приложения в подпапке домена. В этом случае базовый тег может быть более подходящим.

<base href="/subfolder/">