상태가 변경될 때 명명된 보기에서 다시 로드를 방지하려면 어떻게 해야 합니까?각진JS UI-라우터

상태가 변경될 때 명명된 보기에서 다시 로드를 방지하려면 어떻게 해야 합니까?각진JS UI-라우터

나는 훌륭한 것을 사용하고 있습니다.ui-router제 애플리케이션의 모듈입니다.그 일환으로 앱에 있는 '다이나믹 서브 내비게이션'을 관리하기 위해 네이밍 뷰를 사용하고 있습니다.

다음을 고려합니다.

$urlRouterProvider.otherwise('/person/list');

$stateProvider
    .state('person', {
        url: '/person',
        abstract: true,
    })
    .state('person.list', {
        url: '/list',
        views: {
            "main@": {
                templateUrl: "person.list.html",
                controller: 'PersonListController'
            }
        }
    })
    .state('person.details', {
        url: '/{id}',
        views: {
            'main@': {
                templateUrl: "person.details.html",
                controller: 'PersonController'
            },
            'nav@': {
                templateUrl: "person.nav.html",
                controller: 'PersonNavController'
            }
        }
    });

사용자가 처음 앱을 방문하면 사용자 목록이 표시됩니다.사용자가 사용자를 클릭하면 상세 페이지로 이동합니다.아주 기본적인 것.여기 마크업이 도움이 된다면...

<div>
    <aside ui-view="nav"></aside>
    <div ui-view="main"></div>
</div>

하지만, 그PersonNavControllerREST 서비스를 호출하여 사용자 목록을 가져오므로 사용자가 사용자를 볼 때 형제 요소를 탐색할 수 있습니다.위의 방법을 사용하면 템플릿과 컨트롤러가 다시 렌더링되므로 클릭할 때마다 내용이 변경되지 않음에도 불구하고 지연이 발생합니다.

당신을 보호할 방법이 있나요?'nav@'로드된 보기, 새로 고침만 수행합니다.'main@'보기?

내가 사용하는 방식ui-router이 시나리오에서 보기를 최소 공통 분모로 이동합니다.

다른 말:그런 경우에는ui-view="nav"모든 세부 정보 간에 공유되며 모든 세부 정보에 대해 동일합니다(한 번만 로드해야 하므로) - 일부여야 합니다.liststate(상태의 부모)

부모 상태 정의는 다음과 같이 조정됩니다.

.state('person.list', {
    url: '/list',
    views: {
        "main@": {
            templateUrl: "person.list.html",
            controller: 'PersonListController'
        }
        // here we target the person.list.html
        // and its ui-view="nav"
        'nav@person.list': {
            templateUrl: "person.nav.html",
            controller: 'PersonNavController'
        }
    }

그렇다면 묘책은 어디에 있을까요?각진 힘으로ui-router. 각 상태 정의 중에 현재 뷰를 대상으로 할 수 있습니다.자, 이제.nav뷰는 의 일부입니다.list상태 정의 - 즉, 세부 정보 전환 중에 다시 로드되지 않습니다(자세한 설명은 여기를 확인하십시오).

정의된 명명 규칙만 사용하면 됩니다.

• 보기 이름 - 상대 vs.앱솔루트 네임

언급된 문서에서 인용된 몇 개의 대사:

views: {
    ////////////////////////////////////
    // Relative Targeting             //
    // Targets parent state ui-view's //
    ////////////////////////////////////

    // Relatively targets the 'detail' view in this state's parent state, 'contacts'.
    // <div ui-view='detail'/> within contacts.html
    "detail" : { },            

    // Relatively targets the unnamed view in this state's parent state, 'contacts'.
    // <div ui-view/> within contacts.html
    "" : { }, 

    ///////////////////////////////////////////////////////
    // Absolute Targeting using '@'                      //
    // Targets any view within this state or an ancestor //
    ///////////////////////////////////////////////////////

    // Absolutely targets the 'info' view in this state, 'contacts.detail'.
    // <div ui-view='info'/> within contacts.detail.html
    "info@contacts.detail" : { }

    // Absolutely targets the 'detail' view in the 'contacts' state.
    // <div ui-view='detail'/> within contacts.html
    "detail@contacts" : { }

언급URL : https://stackoverflow.com/questions/23568908/how-do-i-prevent-reload-on-named-view-when-state-changes-angularjs-ui-router