无法在 plunker 中运行 Angular 材质示例

Question

我在 plunker 中使用 Angular Material 示例创建了一个示例项目。它一直工作到昨天还没有工作。

即使是 Angular Material 示例也不起作用。你能指出我正确的方向吗？

我遇到了与原始 Angular 材料 plunker 错误相同的错误。

Error: (SystemJS) Unexpected value 'undefined' exported by the module 'PlunkerMaterialModule'
    Error: Unexpected value 'undefined' exported by the module 'PlunkerMaterialModule'
        at d (https://cdnjs.cloudflare.com/ajax/libs/zone.js/0.7.2/zone.min.js:1:10303)
        at syntaxError (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:1729:34)
        at eval (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15596:40)
        at Array.forEach (<anonymous>)
        at CompileMetadataResolver.getNgModuleMetadata (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15594:49)
        at CompileMetadataResolver.getNgModuleSummary (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15507:52)
        at eval (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15580:72)
        at Array.forEach (<anonymous>)
        at CompileMetadataResolver.getNgModuleMetadata (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15565:49)
        at JitCompiler._loadModules (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:27000:70)
        at JitCompiler._compileModuleAndComponents (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:26973:36)
        at JitCompiler.compileModuleAsync (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:26902:37)
        at PlatformRef_._bootstrapModuleWithZone (https://unpkg.com/@angular/core/bundles/core.umd.js:4568:25)
        at PlatformRef_.bootstrapModule (https://unpkg.com/@angular/core/bundles/core.umd.js:4554:21)
        at execute (https://run.plnkr.co/preview/cj8fyb96l00063c5srholji8p/main.ts!transpiled:108:65)
    Error loading https://run.plnkr.co/preview/cj8fyb96l00063c5srholji8p/main.ts
        at d (https://cdnjs.cloudflare.com/ajax/libs/zone.js/0.7.2/zone.min.js:1:10303)
        at syntaxError (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:1729:34)
        at eval (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15596:40)
        at Array.forEach (<anonymous>)
        at CompileMetadataResolver.getNgModuleMetadata (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15594:49)
        at CompileMetadataResolver.getNgModuleSummary (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15507:52)
        at eval (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15580:72)
        at Array.forEach (<anonymous>)
        at CompileMetadataResolver.getNgModuleMetadata (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:15565:49)
        at JitCompiler._loadModules (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:27000:70)
        at JitCompiler._compileModuleAndComponents (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:26973:36)
        at JitCompiler.compileModuleAsync (https://unpkg.com/@angular/compiler/bundles/compiler.umd.js:26902:37)
        at PlatformRef_._bootstrapModuleWithZone (https://unpkg.com/@angular/core/bundles/core.umd.js:4568:25)
        at PlatformRef_.bootstrapModule (https://unpkg.com/@angular/core/bundles/core.umd.js:4554:21)
        at execute (https://run.plnkr.co/preview/cj8fyb96l00063c5srholji8p/main.ts!transpiled:108:65)
    Error loading https://run.plnkr.co/preview/cj8fyb96l00063c5srholji8p/main.ts

https://plnkr.co/edit/GKuQv2GnExGPEE3iWynF?p=preview https://material.angular.io/components/tabs/examples

提前致谢。

Answer 1

md 前缀在 2.0.0-beta.11 中被宣布为已弃用，现在（2.0.0-beta.12）似乎已将其删除。我们应该改用mat。

所以不要导入：

MdTabsModule

和

<md-tab-group class="demo-tab-group">
  <md-tab label="Tab 1">

使用

MatTabsModule

和

<mat-tab-group class="demo-tab-group">
  <mat-tab label="Tab 1">

Plunker Example@2.0.0-beta.12

或者您可以将 angular-material 版本显式设置为 @2.0.0-beta.11：

'@angular/material': 'https://unpkg.com/@angular/material@2.0.0-beta.11/bundles/material.umd.js',

Plunker

我还建议您在这里查看所有示例

• https://github.com/angular/material2/tree/master/src/demo-app