jQWidgets Forums

jQuery UI Widgets Forums Angular jqwidgetwindow create dynamic components with ComponentFactory

This topic contains 2 replies, has 2 voices, and was last updated by  Ivo Zhulev 7 years, 11 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author

  • steffn
    Participant

    Hi,

    i am trying to implement the ComponentFactoryResolver in an Angular4 project with jqwidget windows.

    The main idea is to create several dynamic windows.

    Now my console says that jqxWindowComponent is not supporting the component factory.


    steffn
    Participant
    import {Component, ViewChild, AfterViewInit, ViewContainerRef, ComponentFactoryResolver} from '@angular/core';
    
    // import { NewWindowServiceService } from  './new-window-service.service';
    
    import { jqxWindowComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxwindow';
    import { jqxButtonComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxbuttons';
    import { jqxCheckBoxComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxcheckbox';
    import { jqxTabsComponent } from '../../node_modules/jqwidgets-framework/jqwidgets-ts/angular_jqxtabs';
    
    @Component({
      selector: 'my-app',
      templateUrl: './app.component.neu.html'
    })
    export class AppComponent implements AfterViewInit
    {
    
      //Funktion Add
    
      //constructor (private newService: NewWindowServiceService) {}
    
      @ViewChild('windowReference') window: jqxWindowComponent;
      @ViewChild('mainDemoReference') mainContainer: ViewContainerRef;
    
      constructor(private resolver: ComponentFactoryResolver) {}
    
      ngAfterViewInit(): void
      {
        setTimeout(() =>
        {
          this.window.focus();
        });
      }
      onResizeCheckBox(event: any): void
      {
        if (event.args.checked)
        {
          this.window.resizable(true);
        }
        else
        {
          this.window.resizable(false);
        }
      }
      onDragCheckBox(event: any): void
      {
        if (event.args.checked)
        {
          this.window.draggable(true);
        }
        else
        {
          this.window.draggable(false);
        }
      }
      onShowButton(): void
      {
        this.window.open();
      }
      onHideButton(): void
      {
        this.window.close();
      }
      onNewButton(): void {
        const factory = this.resolver.resolveComponentFactory(jqxWindowComponent);
        this.mainContainer.createComponent(factory);
      }
    
    }
    

    Ivo Zhulev
    Participant

    Hi steffn,

    Look at the following example: http://www.jqwidgets.com/angular/angular-window/angular-window-multiplewindows.htm
    Does it do the same thing you want?

    Best Regards,
    Ivo

    jQWidgets Team
    http://www.jqwidgets.com/

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.