inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added visibility specified for element

Browse Source
This commit is contained in:
Vito Albano
2016-10-25 18:05:10 +01:00
parent e0ddbb6bd8
commit 7f4415428d
3 changed files with 22 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
ng2-components/ng2-activiti-form/src/components/widgets/date/date.widget.html
View File

@@ -1,14 +1,12 @@
<div class="mdl-grid" *ngIf="field?.isVisible"> <div class="mdl-grid" *ngIf="field?.isVisible" id="data-widget">
<div class="mdl-cell mdl-cell--11-col"> <div class="mdl-cell mdl-cell--11-col">
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label date-widget" <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label date-widget"
[class.date-widget__invalid]="!field.isValid"> [class.date-widget__invalid]="!field.isValid">
<input id="dateInput" <input class="mdl-textfield__input"
class="mdl-textfield__input"
type="text" type="text"
[attr.id]="field.id" [attr.id]="field.id"
[attr.required]="isRequired()" [attr.required]="isRequired()"
[(ngModel)]="field.value" [(ngModel)]="field.value"
[value]="field.value"
(ngModelChange)="onDateChanged()" (ngModelChange)="onDateChanged()"
(onOk)="onDateSelected()" (onOk)="onDateSelected()"
[disabled]="field.readOnly"> [disabled]="field.readOnly">
@@ -24,3 +22,4 @@
</button> </button>
</div> </div>
</div> </div>

6
ng2-components/ng2-activiti-form/src/components/widgets/date/date.widget.spec.ts
View File

@@ -83,7 +83,9 @@ describe('DateWidget', () => {
it('should setup trigger element', () => { it('should setup trigger element', () => {
let el = {}; let el = {};
spyOn(nativeElement, 'querySelector').and.returnValue(el); spyOn(nativeElement, 'querySelector').and.returnValue(el);
widget.field = new FormFieldModel(null, {id: 'fake-id'});
widget.ngOnInit(); widget.ngOnInit();
widget.ngAfterViewChecked();
expect(widget.datePicker.trigger).toBe(el); expect(widget.datePicker.trigger).toBe(el);
}); });
@@ -231,7 +233,7 @@ describe('DateWidget', () => {
fixture.whenStable() fixture.whenStable()
.then(() => { .then(() => {
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#date-field-id')).toBeNull(); expect(element.querySelector('#data-widget')).toBeNull();
}); });
})); }));
@@ -258,7 +260,7 @@ describe('DateWidget', () => {
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable() fixture.whenStable()
.then(() => { .then(() => {
expect(element.querySelector('#date-field-id')).toBeNull(); expect(element.querySelector('#data-widget')).toBeNull();
}); });
}); });
dateWidget.checkVisibility(dateWidget.field); dateWidget.checkVisibility(dateWidget.field);

10
ng2-components/ng2-activiti-form/src/components/widgets/date/date.widget.ts
View File

@@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
*/ */
import { Component, ElementRef, OnInit } from '@angular/core'; import { Component, ElementRef, OnInit, AfterViewChecked } from '@angular/core';
import { TextFieldWidgetComponent } from './../textfield-widget.component'; import { TextFieldWidgetComponent } from './../textfield-widget.component';
@Component({ @Component({
@@ -24,7 +24,7 @@ import { TextFieldWidgetComponent } from './../textfield-widget.component';
templateUrl: './date.widget.html', templateUrl: './date.widget.html',
styleUrls: ['./date.widget.css'] styleUrls: ['./date.widget.css']
}) })
export class DateWidget extends TextFieldWidgetComponent implements OnInit { export class DateWidget extends TextFieldWidgetComponent implements OnInit, AfterViewChecked {
DATE_FORMAT: string = 'D-M-YYYY'; DATE_FORMAT: string = 'D-M-YYYY';
@@ -57,8 +57,12 @@ export class DateWidget extends TextFieldWidgetComponent implements OnInit {
} }
this.datePicker = new mdDateTimePicker.default(settings); this.datePicker = new mdDateTimePicker.default(settings);
}
ngAfterViewChecked() {
if (this.elementRef) { if (this.elementRef) {
this.datePicker.trigger = this.elementRef.nativeElement.querySelector('#dateInput'); let dataLocator = '#' + this.field.id;
this.datePicker.trigger = this.elementRef.nativeElement.querySelector(dataLocator);
} }
} }