From 6cb75398011115ea56f7e003db998d95a2d91060 Mon Sep 17 00:00:00 2001 From: Bill Erickson Date: Wed, 13 Jun 2018 12:20:43 -0400 Subject: [PATCH] LP#1775466 Dynamic component continued Signed-off-by: Bill Erickson --- .../share/dynamic-component/dynamic.component.ts | 46 +++++++++++++++++++--- Open-ILS/src/eg2/src/app/share/grid/grid.ts | 4 +- .../src/app/staff/sandbox/sandbox.component.html | 14 +++++++ .../eg2/src/app/staff/sandbox/sandbox.component.ts | 9 +++-- 4 files changed, 61 insertions(+), 12 deletions(-) diff --git a/Open-ILS/src/eg2/src/app/share/dynamic-component/dynamic.component.ts b/Open-ILS/src/eg2/src/app/share/dynamic-component/dynamic.component.ts index 5dba7baa90..35723a83d9 100644 --- a/Open-ILS/src/eg2/src/app/share/dynamic-component/dynamic.component.ts +++ b/Open-ILS/src/eg2/src/app/share/dynamic-component/dynamic.component.ts @@ -1,10 +1,13 @@ -import {Component, OnInit, ViewChild, Input} from '@angular/core'; -import {Compiler, ViewContainerRef, NgModule} from '@angular/core'; +import {Component, OnInit, ViewChild, Input, Output} from '@angular/core'; +import {Compiler, ViewContainerRef, NgModule, EventEmitter} from '@angular/core'; import {HttpClient} from '@angular/common/http'; /** * Render HTML content derived from a string or a URL path, * interpolating the provided context data along the way. + * + * Content text or URL values may be provided as Inputs or passed + * directly to component build* methods. */ @Component({ @@ -17,30 +20,61 @@ export class DynamicComponent implements OnInit { @ViewChild('container', {read: ViewContainerRef}) private container: ViewContainerRef; + @Input() content: string; + @Input() contentUrl: string; + @Input() contextData: any; + + // Emits true if the content was render-able, false otherwise + @Output() onComplete: EventEmitter; + constructor( private compiler: Compiler, private http: HttpClient - ) {} + ) { + this.onComplete = new EventEmitter(); + } ngOnInit() { + if (this.contentUrl) { + this.buildFromUrl(this.contentUrl, this.contextData); + } else if (this.content) { + this.buildFromString(this.content, this.contextData); + } } buildFromString(template: string, context: any = {}) { - this.addComponent(template, context); + try { + this.addComponent(template, context); + } catch (err) { + console.error(`Error rendering dynamic content: ${err}`); + this.onComplete.emit(false); + return; + } + + this.onComplete.emit(true); } // Returns a promise which resolves if the requested URL - // was found, rejected otherwise. + // was found and was render-able, rejected otherwise. buildFromUrl(url: string, context: any = {}): Promise { return this.http.get(url, {responseType: 'text'}).toPromise() .then( html => { console.debug(`Loaded dynamic content from: ${url}`); - this.addComponent(html, context); + try { + this.addComponent(html, context); + } catch (err) { + const msg = `Error rendering dynamic content: ${url}`; + console.error(msg); + this.onComplete.emit(false); + return Promise.reject(msg); + } + this.onComplete.emit(true); }, notFound => { console.debug( `Unable to fetch dynamic component URL: ${url}`, notFound); + this.onComplete.emit(false); } ) } diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.ts b/Open-ILS/src/eg2/src/app/share/grid/grid.ts index 2c7de9def8..480ffe06e0 100644 --- a/Open-ILS/src/eg2/src/app/share/grid/grid.ts +++ b/Open-ILS/src/eg2/src/app/share/grid/grid.ts @@ -290,7 +290,7 @@ export class GridContext { this.store = store; this.format = format; this.pager = new Pager(); - this.pager.limit = 10; // TODO config + this.pager.limit = 10; this.rowSelector = new GridRowSelector(); this.toolbarButtons = []; this.toolbarActions = []; @@ -331,7 +331,6 @@ export class GridContext { if (this.pageChanges) { return; } this.pageChanges = this.pager.onChange$.subscribe( val => this.dataSource.requestPage(this.pager)); - // TODO: index rows as they arrive } ignorePager() { @@ -393,6 +392,7 @@ export class GridContext { getColumnTextContent(row: any, col: GridColumn): string { if (col.cellTemplate) { // TODO + // Extract the text content from the rendered template. } else { return this.getRowColumnValue(row, col); } diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html index 87fc90decf..6fc4afe65c 100644 --- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html +++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html @@ -78,8 +78,22 @@ Dynamic content: +
+ + +Dynamic Complent via URL Inline + + +
+ fall through local template: hello {{world}} +


diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts index 7ff0ac072e..bedadd1d8d 100644 --- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts +++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts @@ -36,7 +36,8 @@ export class SandboxComponent implements OnInit { gridDataSource: GridDataSource = new GridDataSource(); btSource: GridDataSource = new GridDataSource(); - btGridTestContext: any = {hello : 'world'}; + world = 'world'; // for local template version + btGridTestContext: any = {hello : this.world}; testDate: any; @@ -72,19 +73,19 @@ export class SandboxComponent implements OnInit { }; this.dynamic.buildFromString( - 'HELLO {{world}}', {world: 'world'}); + 'HELLO {{world}}', {world: this.world}); /* // Assumes a file on the server at this URL this.dynamicUrl.buildFromUrl( - '/test-template.html', {world: 'world'}); + '/test-template.html', {world: this.world}); */ } doPrint() { this.printer.print({ template: this.printTemplate, - contextData: {world : 'world'}, + contextData: {world : this.world}, printContext: 'default' }); } -- 2.11.0