컨트롤러에 경로 추가하기

Question

나는 이것에 대한 기사를 찾고있다. 그리고 내가 발견 한 것은 런타임에만 상태를 동적으로 추가하는 것이다. 내가 찾은 해결책에 가장 가까운 것은 deferIntercept, $urlRouter.sync() 및 $urlRouter.listen()을 사용합니다. 그러나 $urlRouter은 런타임 (컨트롤러 사용자 작업 전에 실행 됨)에서만 사용할 수 있습니다.

이 plunker은 런타임에 동적 동적 추가 상태 인 을 표시하지만 도전 과제는 대신 컨트롤러에 구현하는 것입니다.

아래의 내용은 내가 달성하고자하는 것을 보여줍니다. 나는이 문제에 대해 수 주일 동안 고심하고있다. 누군가가 내게 욕망 결과를 얻는 방법에 대한 힌트를 줄 수 있기를 바랍니다.

// Predefined state in config 
$stateProvider.state('default', { 
    url: '', 
    templateUrl: '', 
}) 

// Predefined state in config 
$stateProvider.state('home', { 
    url: '', 
    templateUrl: '', 
}) 

// Additional Added state in controller when user click button 
$scope.clickButton = function() { 
    $stateProvider.state('newpage', { 
     url: '', 
     templateUrl: '' 
    }) 
}; 

Answer 1

난 당신의 코드를 약간 업데이트 : 나는이

app.controller('mainCtrl', mainCtrl); 

mainCtrl.$inject = ['$urlRouter']; 
function mainCtrl ($urlRouter) { 
    var vm = this; 

    // 'add new state' button click function 
    vm.addState = function() { 
    var name = 'new-state-' + (vm.hrefs.length - 2); 
    var newState = { 
     "url": "/" + name, 
     "abstract": false, 
     "parent": "", 
     "views": {} 
    }; 
    // add views 
    newState.views[name] = { 
     "name": name, 
     "template": "<div style='padding:20px; border: solid 1px red; margin-bottom: 15px;'>TEMPLATE FOR <em>" + name.toUpperCase() + "</em> GOES HERE</div>" 
    }; 
    newState.views["container@"] = { 
     "name": "container@", 
     "templateUrl": "tpl.content.html" 
    }; 
    newState.views["left@"] = { 
     "name": "left@", 
     "templateUrl": "tpl.left.html" 
    }; 

    $stateProviderRef.state(name, newState); 

    vm.hrefs.push(name); 
    // add to the head 
    vm.views.reverse().push(name); 
    vm.views.reverse() 

    $urlRouter.sync(); 
    $urlRouter.listen(); 
    }; 

    vm.hrefs = ['home', 'other', 'about']; 
    vm.views = ['', 'header', 'left', 'container', 'footer']; 
}