Add clear input in rich text editor
This commit is contained in:
parent
26e10b1299
commit
6cdf560713
|
@ -9,6 +9,7 @@
|
|||
//}
|
||||
|
||||
.editor-wrapper {
|
||||
position: relative;
|
||||
border: 1px solid transparent !important;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
@ -40,6 +41,14 @@
|
|||
border: 1px solid #f44336 !important;
|
||||
}
|
||||
|
||||
.clear {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
bottom: 5px;
|
||||
transform: translate(-50%, -50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.full-width {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import {Component, Input} from "@angular/core";
|
||||
import {AngularEditorConfig} from "@kolkov/angular-editor";
|
||||
import {FormControl} from "@angular/forms";
|
||||
|
||||
@Component({
|
||||
selector: 'rich-text-editor-component',
|
||||
|
@ -7,6 +8,7 @@ import {AngularEditorConfig} from "@kolkov/angular-editor";
|
|||
<div class="editor-wrapper" [class]="wrapperClasses" [formGroup]="parentFormGroup">
|
||||
<angular-editor class="full-width editor" [id]="id" [config]="editorConfig" [formControlName]="controlName"
|
||||
placeholder="{{(placeholder? (placeholder | translate) : '') + (required ? ' *': '')}}"></angular-editor>
|
||||
<mat-icon *ngIf="formInput.value" (click)="formInput.patchValue('')" class="clear">close</mat-icon>
|
||||
</div>
|
||||
`,
|
||||
styleUrls: ['./rich-text-editor.component.scss']
|
||||
|
@ -53,6 +55,7 @@ export class RichTextEditorComponent {
|
|||
]
|
||||
};
|
||||
|
||||
constructor() {
|
||||
get formInput(): FormControl {
|
||||
return this.parentFormGroup.get(this.controlName);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue