在apache tomcat上运行angularjs 2应用程序

时间:2016-07-01 14:55:36

标签: angularjs tomcat angular

我在apache tomcat上运行了一个angularjs应用程序。我尝试使用升级适配器同时使用angular1和angular2但是只要删除了ng-app指令,我的应用程序就会停止工作,尽管已经使用升级适配器来引导应用程序以及迁移指南中提到的后续步骤。我不是在控制台上也出现任何错误。它只是空白。

有什么办法可以在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();

1 个答案:

答案 0 :(得分:0)

  

有什么办法可以在tomcat上完成吗?

当然。 Tomcat,Express,Apache,最简单的节点服务器 - 无论你喜欢哪种网络服务器,都没关系。

  

一旦我删除ng-app指令,我的应用程序就会停止工作......我在控制台上也没有出现任何错误。

听起来你只需要正确引导角度应用程序。如果您需要引导Angular 1应用angular.bootstrap(appRootNode, ['appModuleName']);,请检查angular.bootstrap,直到您迁移到Angular 2引导方法。