How to use ng2-bootstrap in angular2-meteor1.3 project?

For a new project, I have run those in terminal

npm init

meteor add angular2-compilers

meteor remove blaze-html-templates

meteor npm install –save angular2-meteor

meteor npm install –save meteor-node-stubs

meteor npm install –save bootstrap4-webpack-package

meteor npm install –save ng2-bootstrap

import 'reflect-metadata';
import 'zone.js/dist/zone';
import 'bootstrap4-webpack-package';
import { Component } from 'angular2/core';
import { bootstrap } from 'angular2/platform/browser';
import { Alert } from 'ng2-bootstrap/ng2-bootstrap';

@Component({
  selector: 'app',
  template: `<alert type="info">ng2-bootstrap hello world!</alert>`,
  directives: [Alert]
})
class App { }
bootstrap(App);

Right now bootstrap4-webpack-package makes Bootstrap 4 works, but ng2-bootstrap still not works.

Since I am using Bootstrap 4, so I also tried to add

import { Ng2BootstrapConfig, Ng2BootstrapTheme } from 'ng2-bootstrap/ng2-bootstrap';
Ng2BootstrapConfig.theme = Ng2BootstrapTheme.BS4;

But still not works.

It shows the error:

EXCEPTION: No Directive annotation found on Alert

EXCEPTION: Error: Uncaught (in promise): No Directive annotation found on Alert

I am not sure whether this is related with this issue.

How can I use ng2-bootstrap? Thanks

1
Leave a Reply

avatar
1 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Jason
Guest

At last I found it is because of my NPM problem. Because the code can run well on other people’s machine.

I uninstall my NPM, and install the new v5.10.1, the problem fixes!

Check here for details.

Hope this can help people who met similar weird problem.