각도 URL의 모든 슬래시가 % 2F (으)로 변경되었습니다.

Question

각도 라우팅에 심각한 문제가 있습니다. 최근에 모든 것을까지

는 다음과 같은 경로로 잘하고있다 :

$routeProvider.when('/album/:albumId', { 
    controller: 'albumPageController', 
    templateUrl: 'views/album.html' 
}); 

과 HREF를 사용하여 :

<a href="/#/album/{{album.id}}">Link</a> 

그러나, 지금 슬래시의 모든 %의 2 층으로 인코딩되고있다. 나는이 문제를 해결하기 위해 여러 가지를 시도했습니다

http://localhost:8000/#%2Falbum%2F1 

:

그래서 링크, 또는 localhost를 입력 클릭 할 때 : 브라우저에 8000/#/앨범/1 URL이 변경됩니다

href 대신 ng-href 사용 첫 번째/즉 href = "#/album/{{album.id}}"를 사용하지 않음 Homestead localhost (Laravel의 리눅스 매독기) 대신 Windows 10의 로컬 호스트

어떤 도움도 muc가됩니다. 고맙다! 당신이

<a href="/#/album/{{album.id}}">Link</a> 

라우팅 해시 기호가 필요하지 않습니다 당신이 html5mode을 사용하고 있기 때문에

Answer 1

%2F이 슬래시의 percent-encoding이다되고, 링크에서 해시 기호를 제거 / 문자.

이 문제는 AngularJS 1.6이 $location 서비스의 해시 - 뱅 URL에 대한 기본값을 변경 한 것과 관련이 있습니다.

는 이전 동작으로 되돌리려면 :

appModule.config(['$locationProvider', function($locationProvider) { 
    $locationProvider.hashPrefix(''); 
}]); 

자세한 내용은 SO: angularjs 1.6.0 (latest now) routes not working를 참조하십시오.

Answer 2

<a href="/album/{{album.id}}">Link</a> 

Answer 3

가장 간단한 해결책은 클라이언트 측 URL에 !을 추가하는 것입니다 (HTML5 모드를 사용하지 않는 경우 여기에있는 경우 가능).

클라이언트 측이 같은 URL 업데이트 :

> #!/foo/bar

#/foo/bar 그리고 당신이 #을 유지하기 때문에, 서버 측 라우팅과 충돌없이 문제가 있습니다. 모두 행복합니다.

Answer 4

파티가 좀 늦었지만 '!' 귀하의 URL에 잘 작동합니다. 이것은 조금 나를 위해 나를 괴롭혔다. 이것은 최신 AngularJS 1.6.x의 변화이며, 나는 Google이 SPA에 '!' 해시 후. 결과적으로 나의 노선은 그들이해야하는 것처럼 보이지만 나의 탐색은 내가 '!' 내 참조하십시오. 예 :

<ul> 
    <li><a href="#!/">Home</a></li> 
    <li><a href="#!/page2">Page 2</a></li> 
    <li><a href="#!/page3">Page 3</a></li> 
    <li><a href="#!/page4">Page 4</a></li> 
</ul> 

이 정보가 도움이되기를 바랍니다.

감사합니다.

Answer 5

슬래시 부호화를 중지 할 수있다 : 여기서 날 https://www.coditty.com/code/angular-ui-router-replacing-slash-with-2f-quick-fix

Answer 6

설명

$urlMatcherFactoryProvider.type('SlashFix', { 
    raw: true, 
}); 


$stateProvider 
     .state('content',{ 
     url: '/{slug:SlashFix}' 
     ... 

     }) 

, 나는 @Igor 시믹 및 @Umer Z 용액 문제 해결 :

app.config(function($locationProvider) { 

$locationProvider.hashPrefix(''); 
$locationProvider.html5Mode({ 
    enabled: false, 
    requireBase: true 
    }); 
}); 

<a href="#/mylink/"> <span>MyLink</span></a> 

을 어느 give : http://blablabla.co:8888/blabla#/mylink/

희망이 도움이됩니다.