느린로드 각도 1.5 구성 요소

Question

각도 응용 프로그램을 구축 중이며 해당 경로를 요청한 경우에만 구성 요소를로드하려고합니다. 나는 로그인 구성 요소가

export default { 
     register() { 
     angular.module('trending') 
      .component('login',() => ({ 
       template: 'Hello!' 
      }) 
     ) 
    } 
}; 

입니다하지만 오류를 얻을 경우 이런 일이

const states = [{ 
    name: 'login', 
    url: '/login?sessid', 
    component: 'login', 
    resolve: { 
     login:() => import('./components/login.js').then(login => { 
     login.default.register() 
     }), 
    }, 
}]; 

를 작동 할 수 있습니다 생각 로그인 구성 요소 상태 이전에 등록되지 않은 아마도 때문에

angular.js?10a4:13708 Error: [$injector:unpr] Unknown provider: 
loginDirectiveProvider <- loginDirective 

입니다. 이것이 이것이 결재 재산의 목적을 남용하고 있다는 것을 알았습니다. 나는 단지 그것이 나의 필요에 부합하기를 바랐습니다. 이 문제를 해결하는 더 좋은 방법은 무엇입니까?

Answer 1

앱이 부트 스트랩되면 더 이상 구성 요소를 선언 할 수 없습니다. 따라서 런타임에 구성 요소를 등록하려면 어떻게 든 각 공장을 노출해야합니다. 코드는 주 앱 모듈의 모든 팩토리를 노출하지만 원하는 경우 구성 요소 만 사용할 수 있습니다.

const app = angular.module('trending', []); 

app.config(($controllerProvider, $compileProvider, $filterProvider, $provide) => { 
    app.register = { 
     component: $compileProvider.component, 
     controller: $controllerProvider.register, 
     directive: $compileProvider.directive, 
     filter: $filterProvider.register, 
     factory: $provide.factory, 
     service: $provide.service 
    }; 
}); 

이 방법은, 당신은 단지 노출 된 공장에 액세스 할 수 app.register.component를 호출해야합니다. 예를 들어, 귀하의 질문에서 촬영 :

export default { 
     register() { 
     angular.module('trending') 
      .register 
      .component('login',() => ({ 
       template: 'Hello!' 
      }) 
     ) 
    } 
}; 

당신은 당신의 모듈을 등록하는 애호가 방법을 찾을 수 있습니다,이 대답을 위해서 단지 데모입니다, 당신은 용어를 사용하거나 변경 할 수 있습니다 당신의 공상에 더 잘 어울리는 노출 메커니즘 es6+ 구성 요소.