当我单击显示颜色选择器时，我正在使用法拉第颜色选择器，如何将颜色代码从jquery传递到[style.backgroundColor]="color"
HTML：
<button ion-col full clear id="color-picker-handler" (click)="initiateColorPicker()">Pick Color</button>
<ion-row class="selectedColor">
<div class="selectedcolorCircle ion-col" [style.backgroundColor]="color" >
</div>
<div class="selectcolor ion-col">
</div>
</ion-row>
TS文件：
initiateColorPicker() {
jQuery('.selectcolor').farbtastic(function(color) {
console.log(color)});
console.log('Clicked');
}
CSS：
.selectedColor {
padding: 15px;
width: 100%;
min-height: 200px;
text-align: center;
.selectedcolorCircle {
width: 135px;
height: 135px;
border-radius: 50%;
margin: 0 auto;
}
}
这可能对您有帮助，
import { Component, ChangeDetectorRef } from '@angular/core';
@Component({
(...)
})
export class MyComponent {
constructor(private cdr:ChangeDetectorRef) {
}
initiateColorPicker() {
jQuery('.selectcolor').farbtastic((color)=>{
console.log(color)
this.color=color;
this.cdr.detectChanges();
});
console.log('Clicked');
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句