如何将 npm 包 (ng-selectize) 添加和配置到 plunker angular 演示中？

Question

我正在尝试使用 angular 设置一个 plnkr，并且需要在演示中安装和配置 ng-selectize。如何将 npm 包 ng-selectize 添加到我的 plnkr？

http://plnkr.co/edit/msFyhztaC0YP1q6wADKq

import {Component, NgModule, VERSION} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import { NgSelectizeModule } from 'ng-selectize';

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2>
       <ng-selectize [config]="config" [optgroups]="optgroups" [options]="options"></ng-selectize>
    </div>
  `,
})
export class App {
  name:string;
  config = {
      highlight: false,
      create: false,
      persist: true,
      plugins: ['dropdown_direction', 'remove_button'],
      dropdownDirection: 'down',
      optgroupField: 'group', // Name of the property to group items by.
      optgroupLabelField: 'label', // Name of the property to render as an option group label.
      labelField: 'label',
      valueField: 'value',
      maxItems: 1000
    }

  optgroups = [
    {
      group: 'colors',
      label: 'colors'
    },
    {
      group: 'animals',
      label: 'animals'
    }
  ];

  options =   [
    {
      label: 'Red',
      value: 'red',
      group: 'colors'
    }, {
      label: 'Blue',
      value: 'blue',
      group: 'colors'
    }, {
      label: 'Green',
      value: 'green',
      group: 'colors'
    }, {
      label: 'Dog',
      value: 'dog',
      group: 'animals'
    }
  ];
  constructor() {
    this.name = `Angular! v${VERSION.full}`
  }
}

@NgModule({
  imports: [ BrowserModule, NgSelectizeModule ],
  declarations: [ App ],
  bootstrap: [ App ]
})
export class AppModule {}

我遵循了另一个 Whosebug 的回答，该回答说要将其添加到 config.js，但我收到一个 lodash clonedeep not found 错误。

Answer 1

config.js

map: {
  ...,
  'ng-selectize': 'npm:ng-selectize',
  'lodash.clonedeep': 'npm:lodash.clonedeep'
}

index.html

<link rel="stylesheet" href="https://unpkg.com/selectize/dist/css/selectize.css" />
<link rel="stylesheet" href="https://unpkg.com/selectize@0.12.4/dist/css/selectize.bootstrap3.css" />
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script src="https://unpkg.com/ng-selectize/selectize/selectize.standalone.js"></script>

Plunker Example

如何将 npm 包 (ng-selectize) 添加和配置到 plunker angular 演示中？

How do I add and configure an npm package (ng-selectize) into a plunker angular demo?

npm

plunker

plnkr.co

angular