md-card NgModule is not a function

[vapits]

Bug, feature request, or proposal:

Bug (?)
Version: @angular2-material/card": "^2.0.0-alpha.7
Angular version: RC4 (but tested with RC5 also)

Case is is simple from angular2-material options card is the one that simply cannot work in my case. It is install and accessible through systemJs and the usage is this:

Component:

import { Component, OnInit, Input } from '@angular/core';
import { MenuItems } from '../../../models';
import { MD_CARD_DIRECTIVES } from '@angular2-material/card';

@Component({
  moduleId: module.id,
  selector: 'big-icons-vertical-menu',
  templateUrl: 'big-icons-vertical-menu.component.html',
  styleUrls: ['big-icons-vertical-menu.component.css'],
  directives: [MD_CARD_DIRECTIVES]
})
export class BigIconsVerticalMenuComponent implements OnInit {

  @Input() items: MenuItems;

  constructor() { }

  ngOnInit() {
  }

}

Template (well even if there is no template the issue is the same).

<md-card class="text-center detail-menu">
  <md-card-content>
    Text here
  </md-card-content>
</md-card>

When the app runs and i use the component I get:

zone.js:461 Unhandled Promise rejection: TypeError: core_1.NgModule is not a function
at eval (http://localhost:4200/vendor/@angular2-material/core/ripple/ripple.js:168:16)
at Object.eval (http://localhost:4200/vendor/@angular2-material/core/ripple/ripple.js:175:2)
at eval (http://localhost:4200/vendor/@angular2-material/core/ripple/ripple.js:178:4)
at eval (http://localhost:4200/vendor/@angular2-material/core/ripple/ripple.js:179:3)
Evaluating http://localhost:4200/vendor/@angular2-material/core/ripple/ripple.js
Evaluating http://localhost:4200/vendor/@angular2-material/button/button.js
Evaluating http://localhost:4200/app/top-bar/top-bar.component.js
Evaluating http://localhost:4200/app/top-bar/index.js
Evaluating http://localhost:4200/app/shared/index.js
Evaluating http://localhost:4200/app/routes.js
Evaluating http://localhost:4200/main.js
Error loading http://localhost:4200/main.js ; Zone: ; Task: Promise.then ; Value: Error: TypeError: core_1.NgModule is not a function(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426
zone.js:463 Error: Uncaught (in promise): Error: TypeError: core_1.NgModule is not a function(…)consoleError @ zone.js:463_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426

Maybe there is a relation here with #954 but I cannot add my issue there as it is locked for collaborators only.

[yangxiao86]

I met this issue,too.

[vapits]

@xinfangke you solved it somehow though?

[yangxiao86]

@vapits package.json

`
"@angular/common": "2.0.0-rc.5",
"@angular/compiler": "2.0.0-rc.5",
"@angular/core": "2.0.0-rc.5",
"@angular/forms": "0.3.0",
"@angular/http": "2.0.0-rc.5",
"@angular/platform-browser": "2.0.0-rc.5",
"@angular/platform-browser-dynamic": "2.0.0-rc.5",
"@angular/router": "3.0.0-rc.1",

`

Still wrong....

[vapits]

Yes I did it also and still wrong.

[benfuu]

Did you try just using the git version of angular? Look at Material's package.json and try using the same git package version.

[vapits]

@bennycooly I'm not sure what you mean/ Same version of card and core for example? Or you mean something else?

btw i'm getting same issue with any package of material that I'm upgrading to alpha.7

[benfuu]

Ah okay nevermind...when I checked yesterday Material was still using the git version of Angular but I see that they published RC5 now. I was compiling manually but I'll try using Material Alpha7 and Angular RC5.

Did you try to refactor your application to use NgModule? I think I solved this issue by doing that.

[vapits]

Sure. If you manage to solve this please share your experience plz.

[benfuu]

Look at the breaking changes for RC5, especially under "Bootstrapping". Once you refactor your main.ts and app.component.ts to use NgModule, it should work.

[jelbourn]

Closing as this should all be fine in alpha.7

[vapits]

@jelbourn it is not working in alpha.7

[jelbourn]

Try blowing away your node_modules. It sounds like your @angular is stale.

[vapits]

I thought that was it at first place but it is not. alpha.7 (card or tabs or anything) is simply not working neither on RC4 or RC5.

[jelbourn]

I've updated my material2-app to use alpha.7 and RC5 with everything working. Looking at that might help debug your issue.