angular - 在 angular2-rc.7 webpack 中导入 ng2-select

标签 angular webpack ng2-bootstrap

使用 webpack,我使用 npm 安装了 ng2-select,我安装了 ng2-bootstrap 并且工作正常。但是当我导入 ng2-select 时,我的控制台出现以下错误

Uncaught Error: Unexpected directive 'SelectComponent' imported by the module 'AppModule'

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

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';


import { Ng2BootstrapModule } from 'ng2-bootstrap/ng2-bootstrap';
import { SELECT_DIRECTIVES } from "ng2-select/ng2-select";

import { AppComponent }   from './app.component';

@NgModule({
  imports:      [ BrowserModule, Ng2BootstrapModule, SELECT_DIRECTIVES],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

app.component.ts

@Component({
    selector: 'search',
    styleUrls: ['app/assets/ng2-select.css'],
    templateUrl: '<ng-select [items]="items" placeholder="Country">
                </ng-select>'
})
export class AppComponent {
    public items: Array<string> = ['Austria', 'Belgium', 'Bulgaria', 'Croatia',
    'Czech Republic', 'Denmark', 'England', 'Egypt', 'Finland', 'France',
    'Germany', 'Greece', 'Hungary', 'Ireland', 'Italy', 'Netherlands',
    'Poland', 'Spain'];

}

关于如何解决这个问题的任何想法。

最佳答案

您必须在 AppModule 中导入 SelectModule 才能使其正常工作,并删除 SELECT_DIRECTIVES:

@NgModule({
  imports:      [ BrowserModule, Ng2BootstrapModule, SelectModule],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

参见 npm package readme了解更多详情。

关于angular - 在 angular2-rc.7 webpack 中导入 ng2-select,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39509762/

相关文章:

javascript - 类型 'Promise<User>' Angular 6 上不存在“订阅”

angular - 将 ng2-bootstrap 添加到 angular2-seed 时,'tab' 不是已知元素错误

javascript - 如何在 Karma 中配置 System.js 以测试依赖于 moment.js 的代码

Angular 2 : open ng2-bootstrap modal from parent component

javascript - 折线图(google chart)自定义标签

javascript - Angular2 Meteor Web 应用程序的国际化

javascript - Slick.Grid 不是构造函数

javascript - 我如何使用 ReactJS 代码播放和暂停 React-gif 图像

Angular2 - *ngIf 和 *ngFor 创建多个空元素

typescript - 服务器和客户端 TypeScript 项目组织、编译