CustomGrid extending from wjFlexGrid does not work under Ivy (Angular 9)

Posted by: benjamin.schaeublin on 10 March 2020, 1:02 am EST

    • Post Options:
    • Link

    Posted 10 March 2020, 1:02 am EST

    We have created a Grid which is extending from wjFlexGrid, following a sample which is somewhere out there in a sample.

    Here a shortened sample, for what i mean

    import {
    	ChangeDetectorRef,
    	Component,
    	ElementRef,
    	forwardRef,
    	Inject,
    	Injector, Optional,
    	SkipSelf,
    	ViewChild
    } from '@angular/core';
    import {WjFlexGrid, wjFlexGridMeta} from '@grapecity/wijmo.angular2.grid';
    import {CollectionView, DataType, escapeHtml, Rect, SortDescription, Tooltip} from '@grapecity/wijmo';
    import {CellRange, CellRangeEventArgs, CellType, Column, DataMap} from '@grapecity/wijmo.grid';
    
    @Component ({
    	selector: 'app-custom-grid',
    	templateUrl: './customGrid.component.html',
    	inputs: [ ... wjFlexGridMeta.inputs, 'name'],
    	outputs: [...wjFlexGridMeta.outputs, 'onFilterApplied'],
    	providers: [
    		{ provide: 'WjComponent', useExisting: forwardRef(() => CustomGridComponent) },
    		...wjFlexGridMeta.providers
    	]
    })
    export class CustomGridComponent extends WjFlexGrid {
    
    	/* example custom input property */
    	public name: string;
    
        /* 9 other custom input properties */ 
    
    	constructor(@Inject(ElementRef) elRef: ElementRef,
    				@Inject(Injector) injector: Injector,
    				@Inject('WjComponent') @SkipSelf() @Optional() parentCmp: any,
    				@Inject(ChangeDetectorRef) cdRef: ChangeDetectorRef) {
    		super(elRef, injector, parentCmp, cdRef);
    	}
    
    	/*  is called in the last line of any Wijmo component's constructor, and perform necessary initializations here. */
    	public created() {
            // some custom init stuff here
        }
    }
    

    if i build it with ivy, i get following error:

    Compiling TypeScript sources through ngc
    ERROR: src/lib/wijmo/components/customGrid/customGrid.component.ts:24:10 - error NG1010: Failed to resolve inputs at position 0 to a string
    
    24  inputs: [ ...wjFlexGridMeta.inputs, 'name'],
    
    

    If i disable ivy, the build seems to be okay, but another module that uses the custom grid has this error:

    ERROR in Can't bind to 'itemsSource' since it isn't a known property of 'app-custom-grid'.
    
  • Posted 10 March 2020, 8:31 pm EST

    Hi,

    There are some changes that you need to do in order to inherit the FlexGrid while using the Ivy compiler. Please refer to the sample attached. I have added comments in the CustomGridComponent.ts file for your reference.

    Regards,

    Ashwin

    flexgrid extend.zip

  • Posted 11 March 2020, 2:43 am EST

    Hi Ashwin

    Thank you for your sample, that worked perfectly.

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels