Angularjs SPA подробно обновить страницу

Question

Я работаю над применением SPA с помощью Angularjs, вся навигация в приложении работает отлично, но когда я пытаюсь обновить страницу с подробными сведениями (examle: www.domain.com/traveldetail/123), она тормозит страницу ,

app.js

travelApp.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function ($stateProvider, $urlRouterProvider, $locationProvider) { 
    $locationProvider.html5Mode(true); 
    $urlRouterProvider.otherwise("travellist"); 
    $stateProvider 
     .state('/', { 
      url: '/', 
      templateUrl: 'Partials/travellist.html', 
      controller: 'TravelListController' 
     }) 
     .state('travellist', { 
      url: '/travellist', 
      templateUrl: 'Partials/travellist.html', 
      controller: 'TravelListController' 
     }) 
     .state('traveldetail', { 
      url: '/traveldetail/:travelId', 
      templateUrl: 'Partials/traveldetail.html', 
      controller: 'TravelDetailController' 
     }) 
}]) 

Web.config

<rewrite> 
     <rules> 
     <rule name="TravelList" stopProcessing="true"> 
      <match url="^travellist" /> 
      <action type="Rewrite" url="/" /> 
     </rule> 
     <rule name="TravelDetail" stopProcessing="true"> 
      <match url="^traveldetail" /> 
      <action type="Rewrite" url="/" /> 
     </rule> 
     </rules> 
    </rewrite> 

WeApiConfig.cs

public static class WebApiConfig 
{ 
    public static void Register(HttpConfiguration config) 
    { 
     // Web API configuration and services 
     config.Formatters.JsonFormatter.SerializerSettings.ContractResolver = new CamelCasePropertyNamesContractResolver(); 
     // Web API routes 
     config.MapHttpAttributeRoutes(); 

     config.Routes.MapHttpRoute(
      name: "DefaultApi", 
      //routeTemplate: "api/{controller}/{id}", 
      routeTemplate: "api/{controller}/{action}/{id}", 
      defaults: new { id = RouteParameter.Optional } 
     ); 
    } 
} 

Answer 1

Здесь государство должно быть родителем и ребенком, для бывшей

travelApp.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function ($stateProvider, $urlRouterProvider, $locationProvider) { 
$locationProvider.html5Mode(true); 
$urlRouterProvider.otherwise("travellist"); 
$stateProvider 
    .state('travel', { 
     url: '/', 
     templateUrl: 'Partials/travellist.html', 
     controller: 'TravelListController' 
    }) 
    .state('travel.list', { 
     url: '/travellist', 
     templateUrl: 'Partials/travellist.html', 
     controller: 'TravelListController' 
    }) 
    .state('travel.list.detail', { 
     url: '/traveldetail/:travelId', 
     templateUrl: 'Partials/traveldetail.html', 
     controller: 'TravelDetailController' 
    }) 

}])

вы можете обратиться к ui router