2016-04-21 2 views
1

Я хочу использовать подборщик цветов в угловом2. Я попытался использовать библиотеку npm angular2-color-picker. Но после включения директивы я мог видеть только пустой экран. (Ошибка не найдена в консоли). Пожалуйста, помогите мне, зная, где я иду не так, или дайте мне знать, есть ли какая-либо другая библиотека angular2 для выбора цвета. Спасибо заранее.Выбор цвета в угловом2

Мой 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" 
    ] 
} 

ответ

0

Вам нужно настроить библиотеку таким образом:

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

я использую CommonJS как модули – AishApp

+0

библиотека скомпилирована как SystemJS модулей. Если вы хотите использовать его с comonjs, вам необходимо перекомпилировать его. Не могли бы вы добавить в свой вопрос конфигурацию используемого вами компилятора TypeScript? Благодаря! –

+0

Извините за задержанный ответ. Я отредактировал мой вопрос – AishApp

Смежные вопросы