Question

我开始使用angular2（带有express.js后端），目的是将页面的几个部分的控制权传递给angular2组件，但我最终意识到当angular2控制整个区域时系统更有效。页。但是，我的应用程序不是SPA，除了保存angular2根组件的选择器的路由之外，还有其他服务器呈现的路由。

我有两个问题，其次是代码段：

每当我加载一个服务器控制的路由，其服务器端渲染模板不包含我的根组件<main-comp></main-comp>的选择器时，angular2基本上会进入控制台说它没有在任何地方初始化。我将所有angular2初始化代码放在我的整个应用程序的共享头文件中。有没有办法告诉angular2根组件如果它的选择器根本不存在于页面上而不呈现自身？
呈现angular2根组件的服务器端路由为/writing，特定博客帖子的angular2路由URL类似于/writing/2016/03/post。但是，每当我直接浏览到URL时，System.js会尝试相对于该位置加载app / boot，即/writing/2016/03/app/boot，这显然会因404而失败。我认为这是因为我的服务器控制{ {1}}相对于向服务器请求的基本URL的路由和角度加载。因此，我所知道的唯一解决方案是将我的应用程序转换为SPA，其中单个服务器路由为/writing，这将需要对前端进行大量重写。我该如何解决这个问题？

这是我的根组成部分：

'/'

这是@Component({ selector: 'main-comp', template: '<router-outlet></router-outlet>', providers: [TagService, PostService, BlogStateService], directives: [ROUTER_DIRECTIVES, BlogComponent] }) @RouteConfig([ {path: '/writing/...', name: 'Blog', component: BlogComponent } ]) export class AppComponent { constructor(private _blogState : BlogStateService, private _postService : PostService) { } }元素：

<head>

Answer 1

对于第一个问题，我在调用bootstrap方法之前在页面上添加了<main-comp>存在的检查（感谢@Gunter的想法）。

对于我上面的第二个问题，我在system.js配置中添加了一个启动文件的路径，如下所示，这样system.js就不会相对于请求URL加载app / boot。

    System.config({
        packages: {
            app: {
                format: 'register',
                defaultExtension: 'js'
            },
            moment: {
                main: 'moment.js',
                type: 'cjs',
                defaultExtension: 'js'
            }
        },
        map: {
            app: '/app',   //<----------added this line
            moment: '/app/node_modules/moment/'
        }
    });

Answer 2

1）我猜您需要在致电bootstrap()之前手动检查，然后如果找不到选择器则跳过bootstrap()。

2）使用<base>标记设置基本网址或提供APP_BASE_HREF可能会解决这个问题。另请参阅Angular 2 router no base href set

非SPA与angular2

2 个答案: