角度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' 
    } 
    } 
});