CODEWITHSUNDEEP
innerhtmlangular
Viktar K
Viktar K

Reputation: 1528

Inserting angular2 component into native DOM

I'm using DHTMLX library for windows system in my application.

In Angular1 I did something like this:

var windows = new dhtmlXWindows();
var wnd = windows.createWindow();
var new_scope = $rootScope.$new();
var content_dom = angular.element($compile('<div>Content</div>')(new_scope))[0];
wnd.attachObject(content_dom);

Is it possible to do the same in Angular2? I guess I should work with DynamicComponentLoader and loadIntoLocation, but i don't understand what should I put into loadIntoLocation function's parametres hostLocation and anchorName.

Upvotes: 2

Views: 322

Answers (1)

Viktar K
Viktar K

Reputation: 1528

I found this solution. It works, but I'm not sure is it correct to do this.

@Component({
    selector: 'app',
    template: `
      <div #windows></div>
    `
})
class EnviromentComponent {}

var app = bootstrap(EnviromentComponent);

app.then(function (componentRef) {
    var dynamicComponentLoader:DynamicComponentLoader = componentRef.injector.get(DynamicComponentLoader);

    dynamicComponentLoader.loadIntoLocation(MyComponent, componentRef.location, 'windows').then(function(elementRef) {
        var wnd = new dhtmlXWindows();
        wnd.attachObject(elementRef.location.nativeElement);
  });
});

Upvotes: 1

Related Questions