遅延ロード角度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+のコンポーネントによくフィットする露出メカニズム。