2016-12-14 12 views
0

JavaScript(ES5)でAngular 2アプリを作成していて、ライフサイクルフックがフレームワークによって呼び出されていません。角2ライフサイクルフックが呼び出されない(ES5 javascript)

添付されているもの:ngOnInit、index.html、appコンポーネント、appモジュール、main.jsを含むサンプルコンポーネント'all.min.js'はuglifyJSで生成されたすべての私のAngularアプリjsファイルのファイルです。

予期される結果は、コンポーネントのngOnInitが呼び出され、コンソールメッセージ 'ngOnInit'が出力されることになります。 Chromeコンソールにはメッセージは表示されません。 (簡潔にするために短縮)

のindex.html:

<!DOCTYPE html> 
<html> 
<body> 
<app>Loading...</app> 
<script src="/app/assets/javascript/angular/Rx.js"></script> 
<script src="/app/assets/javascript/angular/core.umd.js"></script> 
<script src="/app/assets/javascript/angular/common.umd.js"></script> 
<script src="/app/assets/javascript/angular/compiler.umd.js"></script> 
<script src="/app/assets/javascript/angular/platform-browser.umd.js"></script> 
<script src="/app/assets/javascript/angular/platform-browser-dynamic.umd.js"></script> 
<script src="/app/assets/javascript/angular/forms.umd.js"></script> 
<script src="/app/assets/javascript/angular/shim.min.js"></script> 
<script src="/app/assets/javascript/angular/Reflect.js"></script> 
<script src="/app/assets/javascript/angular/zone.js"></script> 
<script src="/app/assets/javascript/angular/system.js"></script> 
<script src='/app/ng_app/all.min.js'></script> 
</body> 
</html> 

app.component.js:

(function(app) { 
    app.AppComponent = 
    ng.core.Component({ 
     selector: 'app', 
     template: '<brief></brief>' 
    }) 
    .Class({ 
     constructor: function() { 

     } 
    }); 
})(window.app || (window.app = {})); 

app.module.js:

(function(app) { 
    app.AppModule = 
     ng.core.NgModule({ 
      imports: [ng.platformBrowser.BrowserModule, ng.forms.FormsModule], 
      declarations: [app.AppComponent, 
       app.BriefComponent 
      ], 
      bootstrap: [app.AppComponent] 
     }) 
     .Class({ 
      constructor: function() {} 
     }); 
})(window.app || (window.app = {})); 

試料成分(短いです成分):

(function(app) { 
    app.BriefComponent = 
     ng.core.Component({ 
      selector: 'brief', 
      templateUrl: 'ng_app/brief/brief.component.html' 
      ] 
     }) 
     .Class({ 
      constructor: function() { 
      }, 
      ngOnInit: function() { 
       console.log('ngOnInit brief'); 
      } 
}); 
})(window.app || (window.app = {})); 

main.js:

(function(app) { 
    document.addEventListener('DOMContentLoaded', function() { 
    ng.platformBrowserDynamic 
     .platformBrowserDynamic() 
     .bootstrapModule(app.AppModule); 
    }); 
})(window.app || (window.app = {})); 

答えて

1

私はちょうど私のコードにライフサイクルフックを追加した後all.min.jsファイルを再生成することを怠っ判明。

関連する問題