angular-ui-router를 사용하여 $ stateProvider 에서 다른 방법 을 어떻게 사용할 수 있습니까? 아니면 어떻게 사용할 수 있습니까?
답변:
만 사용할 수 없습니다 $stateProvider
.
$urlRouterProvider
다음과 유사한 코드 를 삽입 하고 생성 해야 합니다.
$urlRouterProvider.otherwise('/otherwise');
/otherwise
URL은 평소와 같은 상태를 정의해야합니다 :
$stateProvider
.state("otherwise", { url : '/otherwise'...})
ksperling이 설명하는 이 링크를 참조하십시오.
$stateProvider
. 템플릿을 표시하고 리디렉션하지 않으려면 작업이 덜합니다. @ juan-hernandez의 대답을 선호합니다.
otherwise
(이 경우 '/otherwise'
)이 상태 이름 (에 대한 첫 번째 매개 변수 .state
) 또는 url
옵션 의 값 과 일치해야 합니까?
catch all 구문 ( ) 을 $stateProvider
사용하여 할 수 있습니다 . 다음과 같이 목록 하단에 상태 구성을 추가하기 만하면됩니다."*path"
$stateProvider.state("otherwise", {
url: "*path",
templateUrl: "views/error-not-found.html"
});
모든 옵션은 https://github.com/angular-ui/ui-router/wiki/URL-Routing#regex-parameters에 설명되어 있습니다 .
이 옵션의 좋은 점은 $urlRouterProvider.otherwise(...)
위치 변경을 강요하지 않는다는 것입니다.
you're not forced to a location change
시겠습니까?
/this/does/not/exist
하면 URL은 주소 표시 줄에 그대로 유지됩니다. 다른 솔루션은 다음으로 이동합니다/otherwise
$ state를 else 함수에 수동으로 삽입 할 수도 있습니다. 그러면 URL이 아닌 상태로 이동할 수 있습니다. 이것은 브라우저가 주소 표시 줄을 변경하지 않는 이점이있어 이전 페이지로 돌아가는 것을 처리하는 데 도움이됩니다.
$urlRouterProvider.otherwise(function ($injector, $location) {
var $state = $injector.get('$state');
$state.go('defaultLayout.error', {
title: "Page not found",
message: 'Could not find a state associated with url "'+$location.$$url+'"'
});
});
좋아, 당신이 요청한 질문이 이미 샘플 코드의 첫 줄에 답이 있다는 것을 깨닫는 어리석은 순간! 샘플 코드를 살펴보십시오.
angular.module('sample', ['ui.compat'])
.config(
[ '$stateProvider', '$routeProvider', '$urlRouterProvider',
function ($stateProvider, $routeProvider, $urlRouterProvider) {
$urlRouterProvider
.when('/c?id', '/contacts/:id')
.otherwise('/'); // <-- This is what I was looking for !
....
이미 제공된 훌륭한 답변에 차임하고 싶습니다. 의 최신 버전이 @uirouter/angularjs
클래스 UrlRouterProvider
를 지원 중단 으로 표시했습니다 . 이제 UrlService
대신 사용 하는 것이 좋습니다 . 다음 수정으로 동일한 결과를 얻을 수 있습니다.
$urlService.rules.otherwise('/defaultState');
추가 방법 : https://ui-router.github.io/ng1/docs/1.0.16/interfaces/url.urlrulesapi.html
허용 응답 참조 angular-route
에 대해 묻습니다 ui-router
. 허용 대답은 사용 "모 놀리 식" $routeProvider
요구하는 ngRoute
(반면 모듈을 ui-router
필요로하는 ui.router
모듈)
가장 높은 등급의 대답은 사용 $stateProvider
하는 대신,와 같은 것을 말한다 .state("otherwise", { url : '/otherwise'... })
,하지만 난에 "그렇지"에 대한 언급 찾을 수없는 이 링크 문서를 . 그러나이 답변에서 다음과$stateProvider
같이 언급 되어 있습니다 .
만 사용할 수 없습니다
$stateProvider
. 주사가 필요합니다$urlRouterProvider
그것이 내 대답이 당신을 도울 수있는 곳입니다. 나에게는 다음 $urlRouterProvider
과 같이 사용하는 것으로 충분 했습니다.
my_module
.config([
, '$urlRouterProvider'
, function(
, $urlRouterProvider){
//When the url is empty; i.e. what I consider to be "the default"
//Then send the user to whatever state is served at the URL '/starting'
//(It could say '/default' or any other path you want)
$urlRouterProvider
.when('', '/starting');
//...
}]);
내 제안은 ui-router
문서 ( 이 특정 개정판 ) 와 일치 하며. when(...)
메서드 (함수에 대한 첫 번째 호출) :
app.config(function($urlRouterProvider){
// when there is an empty route, redirect to /index
$urlRouterProvider.when('', '/index');
// You can also use regex for the match parameter
$urlRouterProvider.when(/aspx/i, '/index');
})
$stateProvider.otherwise
그것은 나를 도울 것이다, 그래서)