"abstract : true"상태에 URL을 지정하는 이유는 무엇입니까?

"abstract : true"상태에 URL을 지정하는 이유는 무엇입니까?

---

Ionic의 스캐 폴딩을 더 잘 이해하기 위해 오늘 ui-router를 다루고 있습니다. 제가 알아 차린 한 가지는 "탭"의 추상 된 상태에 URL을 제공한다는 것입니다.

추상 상태를 사용한 유일한 경우에는 빈 문자열을 url로 사용했으며 실수로 추상 상태 (자식 상태가 아닌)로 이동하려고 시도한 적이 있다면 오류가 발생합니다.

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

편집하다:

"또한 실험에서 URL을 내 추상 상태 (Ionic 외부)에 할당하고 중첩 된 상태 뷰를 렌더링하려고하면 큰 거위 알이 생깁니다. 아무것도 표시되지 않습니다."

위의 인용문은 거짓입니다! Plunker 에서 다시 시도했는데 중첩 된 상태가 표시되었습니다.

 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을 사용하여이 상황에 대해 두 가지 상태를 만들 수 있지만 /home/두 번 작성 하고 설명이 좀 더 복잡합니다. 대신 가장 좋은 아이디어는 다른 두 상태가 자식 인 홈 추상 부모를 만드는 것입니다 (ui-router 문서의 경우).

$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