특정 이벤트가 발생한 후 durandal 라우터 탐색 속성을 활성화하십시오.

Question

여러 경로가 정의되어 있습니다. 경로 중 하나는 응용 프로그램 시작시로드되는 내 메인 경로이며이 경로 만 설정했습니다 다른 모든 경로가 설정된 모든 경로 nav: false;

기본 경로의 html 페이지에서 사용자는 데이터베이스 데이터를로드해야합니다. 데이터베이스 데이터가로드 된 경우에만 nav: false;이있는 다른 모든 경로를 true로 설정해야합니다.

function databaseDataLoaded() { 

     for (var i = 0; i < router.routes.length; i++) { 
      router.routes[i].nav = true; 
     } 
    } 

위의 메서드를 호출하여 탐색의 하이퍼 링크를 렌더링하면 렌더링되지 않습니다. 내 router.map 함수는 일반적인 객체 리터럴과 녹아웃 관측 값을 사용하지 않는 문제가 있습니까? 아니면 durandal 아키텍처에서 이와 같은 시나리오를 처리하는 더 좋은 방법이 있습니까?

Answer 1

이 답변

문제는 (내가 무엇을 테스트 2.0 라우터를 사용하는 아직)를 Sammy.js 라우터를 사용하여 Durandal의 1.X 마찬가지입니다 당신이 경로를 매핑하는, 속성이 경로의 일부는 관찰 할 수 없습니다. 라우터는 맵핑하고 맵핑하려는 라우트를 취하는데, 추가 라우트가 맵핑되어야 할 때 다시 돌아가 라우트해야합니다.

예 -

router.map({ 
     url: 'home', 
     moduleId: 'viewmodels/home', 
     name: 'Home', 
     visible: true, 
     settings: {} 
    }); 
    return router.activate('home'); 

및 데이터가로드 된 후, 다음 추가 경로로드

-

var newRoutes = [{ 
    url: 'other', 
    moduleId: 'viewmodels/other', 
    name: 'Other', 
    visible: true, 
    settings: {} 
}, { 
    url: 'about', 
    moduleId: 'viewmodels/about', 
    name: 'About', 
    visible: true, 
    settings: {} 
}]; 
router.map(newRoutes); 

을 편집 당신이 경로를 넣을 수있는 위치에 대한 고민하는 경우에

config.js에 데이터가로드되었을 때로드하려는 모든 경로를 이동하고 앱 시작시 첫 번째 경로 만로드하면됩니다. . 예 -

shell.js

function activate() { 
    datacontext.loadData().then(loadAllRoutes); 
    router.map({ 
     url: 'home', 
     moduleId: 'viewmodels/home', 
     name: 'Home', 
     visible: true, 
     settings: {} 
    }); 
    return router.activate('home'); 
} 

function loadAllRoutes() { 
    var routes = config.routes; 
    router.map(routes); 
} 

대안

당신이/숨기기 다른 이벤트를 기반으로 경로를 보여 여전히 같은 시간에 그들 모두를로드하려면 바로 얻을 NavBar로 좀 더 창의적입니다. 가시성 전환은 계속 표시로 설정되어 있지만

<ul class="nav"> 
    // Show home route always 
    <li>Home</li> 
    <!-- ko foreach: visibleRoutes --> 
    <li>(Put routes here)</li> 
    <!-- /ko --> 
</ul> 

같은 것을 사용하여 데이터로드가 완료 될 때 false에서 true로 dataLoaded을 변경 쉘의 관찰을 만들 수 있습니다.

var dataLoaded = ko.observable(false); 
function activate() { 
    datacontext.loadData().then(loadAllRoutes); 
    var routes = config.routes; 
    router.map(routes); 
    return router.activate(config.startModule); 
} 

function loadAllRoutes() { 
    dataLoaded(true); 
}