2016-07-01 7 views
2

私はanglejsアプリケーションをApache Tomcatで実行していました。私は、アップグレードアダプタを使ってangular1とangular2の両方を使用しようとしましたが、ng-appディレクティブを削除するとすぐに、アプリケーションがブートストラップするためにアップグレードアダプタを使用していてもアプリケーションが動作しなくなり、コンソールにもエラーが表示されます。それは空白です。angulajs 2 apache tomcatでアプリケーションを実行しています

これはtomcatで実行できる方法はありますか?これまでは、npm lite-serverで実行されているサンプルangular2アプリケーションしか見ていませんでした。

index.htmlを

<!-- inject:system:js --><script src="/app/dist/system.src.js"></script><!-- endinject --> 
    <!-- inject:router:js --><script src="/app/dist/router.dev.min.js"></script><!-- endinject --> 
    <!-- inject:systemjs:js --><script src="/app/dist/systemjs.config.js"></script><!-- endinject --> 

<base href="/index.html"> 

<my-app></my-app> 
</body> 
</html> 

systemjs.config.js

 (function(global) { 
// map tells the System loader where to look for things 
var map = { 
    'app':      'app', // 'dist', 
    '@angular':     'node_modules/@angular', 
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
    'rxjs':      'node_modules/rxjs' 
}; 
// packages tells the System loader how to load when no filename and/or no extension 
var packages = { 
    'app':      { main: 'main.js', defaultExtension: 'js' }, 
    'rxjs':      { defaultExtension: 'js' }, 
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 
}; 
var ngPackageNames = [ 
    'common', 
    'compiler', 
    'core', 
    'http', 
    'platform-browser', 
    'platform-browser-dynamic', 
    'router', 
    'router-deprecated', 
    'upgrade', 
]; 
// Individual files (~300 requests): 
function packIndex(pkgName) { 
    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; 
} 
// Bundled (~40 requests): 
function packUmd(pkgName) { 
    packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' }; 
}; 
// Most environments should use UMD; some (Karma) need the individual index files 
var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; 
// Add package entries for angular packages 
ngPackageNames.forEach(setPackageConfig); 
var config = { 
    map: map, 
    packages: packages 
} 
System.config(config); 
})(this); 
System.import('/app/main.js').then(null, console.error.bind(console)); 

main.ts

import { upgradeAdapter } from './upgrade-adapter'; 
upgradeAdapter.bootstrap(document.body, ['utdApp']); 

アップグレード-adapter.ts

import { UpgradeAdapter} from '@angular/upgrade'; 
export const upgradeAdapter = new UpgradeAdapter(); 
+0

Tomcat、Express、Apache - 使用しているサーバーは問題ありません。 * "ng-appディレクティブを削除するとアプリケーションが動作を停止する" * - アプリケーションを適切にブートストラップしないことを意味します。 – dfsq

答えて

0

これはTomcatで実行できる方法はありますか?

もちろんです。 Tomcat、Express、Apache、最も単純なノードサーバー - 好みのWebサーバーであれば問題ありません。

ng-appディレクティブを削除すると、アプリケーションが動作しなくなります...コンソールでもエラーは発生しません。

角度アプリケーションを適切にブートストラップする必要があります。 Angular 1アプリケーションangular.bootstrap(appRootNode, ['appModuleName']);をブートストラップする必要がある場合は、Angular 2ブートストラップ方式に移行するまでangular.bootstrapをチェックしてください。

+0

私はこのような手順に従っています:私のアプリケーションのための[link](https://github.com/thoughtram/angular-upgrade-app#e1)、私はすべての場所を持っているようです。私のコードスニペットで質問を編集させてください。何かを逃したかもしれません。 –

+0

私はngUpgradeについてはわかりませんが、Angular2アプリではベースhrefを '/'または '.'にしています。あなたはこれをチェックしたいかもしれません – Siraj

関連する問題