programing

"요약: 참" 상태에 URL을 지정하는 이유는 무엇입니까?

golfzon 2023. 3. 20. 23:46
반응형

"요약: 참" 상태에 URL을 지정하는 이유는 무엇입니까?

저는 오늘 Ionic어로 된 발판을 더 잘 이해하기 위해 ui-router를 만지작거리고 있는데, 한 가지 깨달은 것은 추상화된 상태의 "탭"에 URL이 있다는 것입니다.

추상 상태를 사용해 본 적이 있는 유일한 경우, 빈 문자열을 URL로 사용했는데, 실수로 (자녀 상태가 아닌) 추상 상태로 이동하려고 하면 다음과 같은 오류가 발생합니다.

추상 상태 '[insertAbstractState]로 전환할 수 없습니다.여기]'

편집:

게다가 실험을 할 때 (Ionic 이외의) 추상적인 상태에 URL을 할당하고 중첩된 상태 뷰를 렌더링하려고 하면 큰 거위알이 나옵니다.아무것도 표시되지 않습니다.

위에 인용된 진술은 거짓입니다!플런커에서 다시 시도해보니 네스트된 상태가 나타났다.

 angular.module('routingExperiments', ['ui.router'])
      .config(function($urlRouterProvider, $stateProvider) {

    $stateProvider

      .state('abstractExperiment', {
        abstract: true,
        url: '', //<--- seems as if any string can go here.
        templateUrl: 'abstractExperiment.html'
      })
      .state('abstractExperiment.test1', {
        url: '/test1',
        templateUrl: 'abstractTest1.html'
      });
  });

분명히 나는 그것을 잘못하고 있었다.새로운 질문은 다음과 같습니다.

추상적인 상태를 채용할 때 빈 문자열이 아닌 이름 있는 상태를 사용할 이유가 있는가, 아니면 단지 스타일 선택인가?

추상 상태를 사용하는 이유는 URL의 일부를 탐색할 수 없는 경우 정의를 건조한 상태로 유지하기 위해서입니다.예를 들어 다음과 같은 URL 방식이 있다고 가정합니다.

/home/index
/home/contact

단, 어떤 이유로든 이 URL은 유효하지 않습니다(즉, 페이지 목적이 없습니다).

/home

이 상황에 대해 완전한 URL을 사용하여 2개의 상태를 작성할 수 있습니다.다만, 이 경우는 기입합니다./home/두 번, 그리고 묘사가 좀 더 복잡해요.대신 다른 2개의 상태가 자녀인 가정 추상 부모(ui-router docs의 경우)를 작성하는 것이 가장 좋습니다.

$stateProvider
    .state('parent', {
        url: '/home',
        abstract: true,
        template: '<ui-view/>'
    })
    .state('parent.index', {
        url: '/index',
        templateUrl: 'index.html'
    })
    .state('parent.contact', {
        url: '/contact',
        templateUrl: 'contact.html'
    })

부모 상태 내에서 템플릿이 할당되어 있는 것에 주의해 주십시오.ui-view이렇게 하면 하위 항목이 렌더링됩니다(그래서 자신의 항목이 공백으로 표시되는 것일 수 있습니다).


경우에 따라서는 빈 URL에 추상 상태를 사용할 수 있습니다.이 설정을 가장 잘 사용하는 것은 부모가 필요한 경우입니다.resolve예를 들어, 일부 상태에 특정 서버 데이터가 필요할 수 있습니다.따라서 각 상태에 동일한 해결 함수를 넣는 대신 원하는 해결 방법을 사용하여 빈 URL 부모를 만들 수 있습니다.또, 계층형 컨트롤러를 필요로 하는 경우에서도, 부모로부터 뷰가 필요 없는 경우(이것이 필요한 이유는 불명확하지만, 타당성이 있다)에도 도움이 됩니다.

.state('home', {
        url: '/home',
        abstract:true,                        
        controller: "HomeController",
        templateUrl:"path to your html"                       
})
.state('home.list', {
        url:"",
        controller: "HomelistController",
        templateUrl:"path to your html" 
})

추상 상태를 사용하고 컨트롤러/페이지를 새로고침하여 UI 라우터가 네비게이션을 수행할 수 있도록 합니다.

언급URL : https://stackoverflow.com/questions/33181532/why-give-an-abstract-true-state-a-url

반응형