Angular2 应用程序不会在 Plunker 中加载

Question

突击测试！我在 Plunker 中构建了一个 Anguar2 示例，反映了我面临的路由问题，这样我就可以 post 向 Whosebug 提出问题，但我无法在 Plunker 中得到该死的东西运行。索引页面加载没有错误，但我的应用程序组件从未在页面上呈现。如果您能发现我的配置问题，我会给您吹牛的权利，这样我就可以 post 我真正的问题了。提前致谢。

这是我的例子http://plnkr.co/edit/2imWa2?p=preview

所有代码都在 Plunker 中。这是我从这个有效的 Angular 2 示例 (http://plnkr.co/edit/FNBFPE?p=preview) 中获取的配置文件，用于尝试设置应用程序，但我认为它与我的设置不兼容。

System.config({
  //use typescript for compilation
  transpiler: 'typescript',
  //typescript compiler options
  typescriptOptions: {
    emitDecoratorMetadata: true
  },
  //map tells the System loader where to look for things
  map: {
     app: "./src"
  },
  //packages defines our app package
  packages: {
    app: {
      main: 'src/app.ts',
      defaultExtension: 'ts'
    }
  }
});

Answer 1

你应该bootstrap你的应用程序是这样的：

import {bootstrap} from 'angular2/platform/browser';
import {ROUTER_PROVIDERS} from 'angular2/router';

import {App} from './app';

bootstrap(App, [ ROUTER_PROVIDERS ]);

看到这个从你自己的插件中派生出来的插件：http://plnkr.co/edit/QOwTLC?p=preview

Answer 2

我使用了另一个模板https://plnkr.co/edit/NIbxKB?p=preview我不知道这是否是你想要的，但这样它就可以工作了。

这里还有一个来自 Angular 团队成员 http://plnkr.co/edit/mk8wPfoqS66Qsuu2yN4F?p=preview 的 Plunker。它显示了如何在全球范围内提供 ROUTER_DIRECTIVES。

bootstrap(App, [
  ROUTER_PROVIDERS,
  provide(LocationStrategy, {useClass: HashLocationStrategy}),
  provide(PLATFORM_DIRECTIVES, {useValue: [ROUTER_DIRECTIVES], multi: true})
]).catch(err => console.error(err));

Angular2 应用程序不会在 Plunker 中加载

Angular2 app won't load in Plunker

plunker

angular