AngularJs UI-Router - $ stateProvider가 추상 상태를 읽을 수 없습니다.

html5Mode에 문제가 있습니다. 내 MVC 프로젝트에서 나는 단 하나의 컨트롤러 만 가지고있다.

public class HomeController : Controller 
    { 
     public ActionResult Index() 
     { 
      return this.File("index.html", "text/html"); 
     } 
    }

나의 각 프로젝트에서 나는 두 개의 경로와 하나의 추상을 가지고있다. "기사" URL : "응용 프로그램/기사" 기본값 :

angular.module('app').config(function ($urlRouterProvider, $stateProvider, $locationProvider) { 
    // if none of the above states are matched, use this as the fallback 
    $urlRouterProvider.otherwise('/app/articles'); 

    $stateProvider 
     .state('app', { 
      url: "/app", 
      abstract: true, 
      templateUrl: "templates/blocks/layout.html", 
      controller: 'AppCtrl' 

     }) 
     .state('app.articles', { 
      url: "/articles", 
      templateUrl: 'templates/articles.html', 
      controller: 'ArticlesCtrl' 
     }) 
     .state('app.one-article', { 
      url: "/articles/:articleId", 
      templateUrl: 'templates/one-article.html', 
      controller: 'OneArticleCtrl' 
     }); 

    // use the HTML5 History API 
    $locationProvider.html5Mode(true).hashPrefix('!'); 
});

이

은 RouteConfig.cs에 공공 정적 무효 RegisterRoutes (RouteCollection 경로) { routes.MapRoute ( 이름입니다 새 {컨트롤러 = "홈", 액션 = "인덱스"});

 routes.MapRoute(
      name: "Default", 
      url: "{*url}", 
      defaults: new { controller = "Home", action = "Index" }); 
    }

루트에서 탐색 할 때 모든 것이 잘 작동합니다. 하지만 새로 고침 버튼을 클릭하면 추상 상태가로드되지 않습니다. 이 문제를 해결하는 방법을 도와주세요.

감사

최신 각도 우리가 선택해야하는 $locationProvider.html5Mode() 설정으로

출처

2014-11-27 Bogdan Nicovski

나는이 문제를 해결했다.

인덱스 파일이 솔루션의 루트에 있습니다. 대신 그 index.html 파일을 제거하고 MVC 뷰보기 -> 홈 -> Index.cshtml을 만들었습니다. 모든 HTML은 index.html과 동일합니다.이제

컨트롤러에 내가 대신의

public ActionResult Index() 
    { 
     return this.View(); 
    }

사용하고 있습니다에서 :

여기

 public ActionResult Index() 
     { 
      return this.File("index.html", "text/html"); 
     }

내 RouteConfig.cs이

public static void RegisterRoutes(RouteCollection routes) 
     { 
      routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); 

      routes.MapRoute(
         name: "AngularCatchAllRoute", 
         url: "{*any}", 
         defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional } 
          ); 
     }

희망 누군가가이 문서를 찾을 수 있습니다을 유능한.

보그 단

출처

2014-11-29 01:25:13

, 하나

1) <base href=" 또는
2) $locationProvider.html5Mode(setting) 모드로 다른 설정을 통과 제공합니다.

<!DOCTYPE html> 
<html ng-app="MyApp"> 

    <head> 
    <title>My App</title> 
    <script> 
     document.write('<base href="'+ document.location.pathname +'" />') 
    </script> 
    </head>

은 여기를 확인하십시오 : $locationProvider

PARAM : 모드 유형 : (선택 사항) booleanObject
을
나는 헤더에이 특별한 행이있는 working plunker을 생성

부울 값이면 html5Mode.enabled를 value로 설정합니다.

개체가 설정된 경우 requireBase 및 rewriteLinks가 각각의 값으로 설정됩니다. 지원되는 속성 :
- - {boolean} - (기본값 : false) true 인 경우 지원되는 경우 url을 변경하려면 history.pushState를 사용합니다. pushState를 지원하지 않는 브라우저에서 해시 프리픽스가있는 경로로 되돌아갑니다. - requireBase - {부울} - (기본값 : true) html5Mode가 활성화되면 태그가 있어야하는지 여부를 지정합니다. enabled이고 requireBase가 true이고 기본 태그가 없으면 $ location을 삽입하면 오류가 발생합니다. 자세한 내용은 $ location guide를 참조하십시오. - rewriteLinks - {boolean} - (기본값 : true) html5Mode를 사용하면 상대 링크에 대한 URL 재 작성을 활성화/비활성화합니다.

출처

2014-11-27 12:03:52

빠른 응답을 주셔서 감사합니다. 를 너무 많은 각도의 빈 페이지가 있습니다. 오류. 어쩌면 IIS 구성에 문제가 있습니까? –

서버 설정에 대한 필수 세부 정보 : [방법 : html5Mode와 작동하도록 서버 구성] (https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to- 구성 - 귀하의 서버 - 일 - html5mode와 함께) BTW 내가 document.write을 사용하여 plunker에 그것은 필수, URL이 변경됩니다. 귀하의 경우 그것은'기본 = "/"'... 시험해 볼 수 있습니다 ... 플 런커는 –

라디움 감사를 다시 비교하는 데 도움이됩니다. 내 서버가 구성되었고 base = "/"로 변경되었으며 같은 문제가 다시 발생합니다. 이것은 정말 이상한 행동입니다. 각도 리디렉션 날 잘 때 원하는 링크를 수동으로 갈 레이아웃이 깨져 모든 스크립트 및 CSS로드되지 않습니다. –

AngularJs UI-Router - $ stateProvider가 추상 상태를 읽을 수 없습니다.

답변

관련 문제