角度1.5のコンポーネントが登録されていないようです

Question

現在、角度1.5の.component()メソッドを使用してアプリケーションを作成しています。次のように私のコンポーネントのコードは次のとおりです。次のように

(function() { 
    'use strict'; 

    function controllerFn($state) { 

    console.log('controllerFn'); // this logs fine 
    this.testVar = 'test me'; 

    this.onLoadComplete = function() { 
     $state.go('main'); 
     console.log('load completed') 
    }; 

    } 

    APP.component('appPreloader', { 
    controller: controllerFn, 
    controllerAs: 'appPreloader' 
    }); 

}()); 

と私のテンプレートコードは次のとおりです。

<app-preloader class="page-preloader"> 
     {{appPreloader.testVar}} 
     <preloader on-complete="appPreloader.onLoadComplete"></preloader> 
</app-preloader> 

私が午前の問題は、私の見解でappPreloaderが空であることであり、例えば、{{appPreloader.testVar}}は何もレンダリングしません。

私はこれが.components()の分離スコープに関連していることを知っていますが、私はこれをすべてのためにどのように動作させるべきかについては、どのように設定するべきかについてかなり困惑しています。

アドバイスをいただければ幸いです。

乾杯

Answer 1

あなたは、component/directiveとDOMの一部は、コンポーネントのコンテキストでコンパイルされていないということdirective/component内に存在するコンテンツをtemplate/templateUrlを持っていない限り。 component内部のtemplateの内部HTMLをコンポーネントコンテキストでコンパイルする必要があります。

チェックアウトPlunkr Hereここではapp-preloaderの内側に、mainCtrlの変数（コンテキスト）にアクセスできます。

this plunkrをチェックできる場合は、コンポーネントの内部HTMLを、作業を開始したコンポーネントのtemplateプロパティに直接移動しました。