无法获得ng2-bootstrap

时间:2015-12-17 09:48:44

标签: angular ng2-bootstrap

这是我的app.ts文件:

import {bootstrap}    from 'angular2/platform/browser'
import {AppComponent} from './app.component'
bootstrap(AppComponent);

这是我的app.component.ts文件:

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

我收到此错误enter image description here

2 个答案:

答案 0 :(得分:2)

我通过在index.html中配置脚本来实现这一目的:

<script>
      System.config({
        packages: {       
          app: {
            format: 'register',
            defaultExtension: 'js'
          },
          "node_modules/ng2-bootstrap": {
              defaultExtension: 'js'
           }
        },
        paths: {
            "ng2-bootstrap/ng2-bootstrap":   "node_modules/ng2-bootstrap/ng2-bootstrap",
            "angular_material/material":   "node_modules/angular_material/material",
            "moment":   "node_modules/ng2-bootstrap/node_modules/moment/moment"
          }
      });
      System.import('app/main')
            .then(null, console.error.bind(console));
    </script>

另外,不要忘记添加引导样式

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">

答案 1 :(得分:0)

如果有人仍有问题我使用此配置,只需在System.config的app部分添加了moment配置:

"node_modules/moment": {
                    defaultExtension: 'js'

      }

这是完整的System.config

System.config({
            packages: {
                app: {
                    format: 'register',
                    defaultExtension: 'js'
                },
                "node_modules/ng2-bootstrap": {
                    defaultExtension: 'js'
                },
               //Added moment in app section
                "node_modules/moment": {
                    defaultExtension: 'js'
                }
            },
            paths: {
                "ng2-bootstrap/ng2-bootstrap": "node_modules/ng2-bootstrap/ng2-bootstrap",
                "angular_material/material": "node_modules/angular_material/material",
                "moment": "node_modules/moment/moment"
            }
        });