mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
Base class for 'textfield' widgets
Reduces repetitive code needed to fix MDL problems for textfield-based components
This commit is contained in:
@@ -16,7 +16,7 @@
|
||||
*/
|
||||
|
||||
import { Component, ElementRef, OnInit } from '@angular/core';
|
||||
import { WidgetComponent } from './../widget.component';
|
||||
import { TextFieldWidgetComponent } from './../textfield-widget.component';
|
||||
|
||||
@Component({
|
||||
moduleId: module.id,
|
||||
@@ -24,12 +24,12 @@ import { WidgetComponent } from './../widget.component';
|
||||
templateUrl: './amount.widget.html',
|
||||
styleUrls: ['./amount.widget.css']
|
||||
})
|
||||
export class AmountWidget extends WidgetComponent implements OnInit {
|
||||
export class AmountWidget extends TextFieldWidgetComponent implements OnInit {
|
||||
|
||||
currency: string = '$';
|
||||
|
||||
constructor(private elementRef: ElementRef) {
|
||||
super();
|
||||
constructor(elementRef: ElementRef) {
|
||||
super(elementRef);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
@@ -38,21 +38,4 @@ export class AmountWidget extends WidgetComponent implements OnInit {
|
||||
}
|
||||
}
|
||||
|
||||
setupMaterialComponents(componentHandler: any): boolean {
|
||||
// workaround for MDL issues with dynamic components
|
||||
if (componentHandler) {
|
||||
componentHandler.upgradeAllRegistered();
|
||||
if (this.elementRef && this.hasValue()) {
|
||||
let el = this.elementRef.nativeElement;
|
||||
let container = el.querySelector('.mdl-textfield');
|
||||
if (container) {
|
||||
container.MaterialTextfield.change(this.field.value);
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -16,7 +16,7 @@
|
||||
*/
|
||||
|
||||
import { Component, ElementRef } from '@angular/core';
|
||||
import { WidgetComponent } from './../widget.component';
|
||||
import { TextFieldWidgetComponent } from './../textfield-widget.component';
|
||||
|
||||
@Component({
|
||||
moduleId: module.id,
|
||||
@@ -24,27 +24,10 @@ import { WidgetComponent } from './../widget.component';
|
||||
templateUrl: './date.widget.html',
|
||||
styleUrls: ['./date.widget.css']
|
||||
})
|
||||
export class DateWidget extends WidgetComponent {
|
||||
export class DateWidget extends TextFieldWidgetComponent {
|
||||
|
||||
constructor(private elementRef: ElementRef) {
|
||||
super();
|
||||
}
|
||||
|
||||
setupMaterialComponents(componentHandler: any): boolean {
|
||||
// workaround for MDL issues with dynamic components
|
||||
if (componentHandler) {
|
||||
componentHandler.upgradeAllRegistered();
|
||||
if (this.elementRef && this.hasValue()) {
|
||||
let el = this.elementRef.nativeElement;
|
||||
let container = el.querySelector('.mdl-textfield');
|
||||
if (container) {
|
||||
container.MaterialTextfield.change(this.field.value);
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
constructor(elementRef: ElementRef) {
|
||||
super(elementRef);
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -16,7 +16,7 @@
|
||||
*/
|
||||
|
||||
import { Component, ElementRef } from '@angular/core';
|
||||
import { WidgetComponent } from './../widget.component';
|
||||
import { TextFieldWidgetComponent } from './../textfield-widget.component';
|
||||
|
||||
@Component({
|
||||
moduleId: module.id,
|
||||
@@ -24,27 +24,10 @@ import { WidgetComponent } from './../widget.component';
|
||||
templateUrl: './multiline-text.widget.html',
|
||||
styleUrls: ['./multiline-text.widget.css']
|
||||
})
|
||||
export class MultilineTextWidget extends WidgetComponent {
|
||||
export class MultilineTextWidget extends TextFieldWidgetComponent {
|
||||
|
||||
constructor(private elementRef: ElementRef) {
|
||||
super();
|
||||
}
|
||||
|
||||
setupMaterialComponents(handler: any): boolean {
|
||||
// workaround for MDL issues with dynamic components
|
||||
if (handler) {
|
||||
handler.upgradeAllRegistered();
|
||||
if (this.elementRef && this.hasValue()) {
|
||||
let el = this.elementRef.nativeElement;
|
||||
let container = el.querySelector('.mdl-textfield');
|
||||
if (container) {
|
||||
container.MaterialTextfield.change(this.field.value);
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
constructor(elementRef: ElementRef) {
|
||||
super(elementRef);
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -16,7 +16,7 @@
|
||||
*/
|
||||
|
||||
import { Component, ElementRef } from '@angular/core';
|
||||
import { WidgetComponent } from './../widget.component';
|
||||
import { TextFieldWidgetComponent } from './../textfield-widget.component';
|
||||
|
||||
@Component({
|
||||
moduleId: module.id,
|
||||
@@ -24,24 +24,10 @@ import { WidgetComponent } from './../widget.component';
|
||||
templateUrl: './number.widget.html',
|
||||
styleUrls: ['./number.widget.css']
|
||||
})
|
||||
export class NumberWidget extends WidgetComponent {
|
||||
export class NumberWidget extends TextFieldWidgetComponent {
|
||||
|
||||
constructor(private elementRef: ElementRef) {
|
||||
super();
|
||||
constructor(elementRef: ElementRef) {
|
||||
super(elementRef);
|
||||
}
|
||||
|
||||
setupMaterialComponents(handler: any): boolean {
|
||||
// workaround for MDL issues with dynamic components
|
||||
if (handler) {
|
||||
handler.upgradeAllRegistered();
|
||||
if (this.elementRef && this.hasValue()) {
|
||||
let container = this.elementRef.nativeElement.querySelector('.mdl-textfield');
|
||||
if (container) {
|
||||
container.MaterialTextfield.change(this.field.value.toString());
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
@@ -18,4 +18,3 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-
|
||||
|
@@ -16,7 +16,7 @@
|
||||
*/
|
||||
|
||||
import { Component, ElementRef } from '@angular/core';
|
||||
import { WidgetComponent } from './../widget.component';
|
||||
import { TextFieldWidgetComponent } from './../textfield-widget.component';
|
||||
|
||||
@Component({
|
||||
moduleId: module.id,
|
||||
@@ -24,27 +24,10 @@ import { WidgetComponent } from './../widget.component';
|
||||
templateUrl: './text.widget.html',
|
||||
styleUrls: ['./text.widget.css']
|
||||
})
|
||||
export class TextWidget extends WidgetComponent {
|
||||
export class TextWidget extends TextFieldWidgetComponent {
|
||||
|
||||
constructor(private elementRef: ElementRef) {
|
||||
super();
|
||||
}
|
||||
|
||||
setupMaterialComponents(componentHandler: any): boolean {
|
||||
// workaround for MDL issues with dynamic components
|
||||
if (componentHandler) {
|
||||
componentHandler.upgradeAllRegistered();
|
||||
if (this.elementRef && this.hasValue()) {
|
||||
let el = this.elementRef.nativeElement;
|
||||
let container = el.querySelector('.mdl-textfield');
|
||||
if (container) {
|
||||
container.MaterialTextfield.change(this.field.value);
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
constructor(elementRef: ElementRef) {
|
||||
super(elementRef);
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -0,0 +1,47 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright 2016 Alfresco Software, Ltd.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { ElementRef } from '@angular/core';
|
||||
import { WidgetComponent } from './widget.component';
|
||||
|
||||
export abstract class TextFieldWidgetComponent extends WidgetComponent {
|
||||
|
||||
protected elementRef: ElementRef;
|
||||
|
||||
constructor(elementRef: ElementRef) {
|
||||
super();
|
||||
this.elementRef = elementRef;
|
||||
}
|
||||
|
||||
// Overrides base implementation
|
||||
setupMaterialComponents(handler: any): boolean {
|
||||
// workaround for MDL issues with dynamic components
|
||||
if (handler) {
|
||||
handler.upgradeAllRegistered();
|
||||
if (this.elementRef && this.hasValue()) {
|
||||
let el = this.elementRef.nativeElement;
|
||||
let container = el.querySelector('.mdl-textfield');
|
||||
if (container) {
|
||||
container.MaterialTextfield.change(this.field.value.toString());
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
Reference in New Issue
Block a user