角度2中的颜色选择器

Question

我想在角度2中使用颜色选择器。我尝试使用npm angular2-color-picker库。但是在包含该指令后，我只能看到一个空白屏幕。 （在控制台中找不到错误）。请帮助我知道我错了什么或让我知道是否有任何其他angular2库可用于颜色选择。提前感谢。

我的HTML包括：

<div> 
<label>Primary</label> 
<input [(colorPicker)]="color" [style.background]="color" [value]="color"/> 
</div> 

我的TS：（AppComponent页航线DesignPage）

import {Component, OnInit} from 'angular2/core'; 
import {ColorPickerDirective} from 'angular2-color-picker/app/color-picker/color-picker.directive'; 
@Component({ 
    selector: 'my-design', 
    templateUrl: 'wwwWeb/build/component/design/design.html', 
    directives: [ColorPickerDirective] 
}) 
export class DesignPage implements OnInit { 
private color: string = "#127bdc"; 
} 

我Boot.ts

import {bootstrap} from 'angular2/platform/browser'; 
import {AppComponent} from './app.component'; 
import {ColorPickerService} from './color-picker/color-picker.service' 

bootstrap(AppComponent, [ColorPickerService]); 

我Tsconfig

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false 
    }, 
    "exclude": [ 
    "../node_modules", 
    "typings/main", 
    "typings/main.d.ts" 
    ] 
} 

Answer 1

您需要配置的存储库这样：

System.config({ 
    map: { 
    'angular2-color-picker': 'node_modules/angular2-color-picker' 
    }, 
    packages: { 
    (...) 
    'angular2-color-picker': { 
     format: 'register', 
     defaultExtension: 'js' 
    } 
    } 
});