Skip to content

Commit

Permalink
fix(utils): now attach to body should work for mixed ng1+ng2 apps
Browse files Browse the repository at this point in the history
fixes #1069, fixes #1056
  • Loading branch information
valorkin committed Oct 4, 2016
1 parent 5d51939 commit 99f15c8
Show file tree
Hide file tree
Showing 2 changed files with 15 additions and 9 deletions.
4 changes: 2 additions & 2 deletions components/buttons/button-radio.directive.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,13 @@ import {
} from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';

/*tslint:disable*/
/* tslint:disable */
export const RADIO_CONTROL_VALUE_ACCESSOR: any = {
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => ButtonRadioDirective),
multi: true
};
/*tslint:enable*/
/* tslint:enable */

@Directive({ selector: '[btnRadio]', providers: [RADIO_CONTROL_VALUE_ACCESSOR] })
export class ButtonRadioDirective implements ControlValueAccessor, OnInit {
Expand Down
20 changes: 13 additions & 7 deletions components/utils/components-helper.service.ts
Original file line number Diff line number Diff line change
Expand Up @@ -39,14 +39,20 @@ export class ComponentsHelper {
* @returns {ViewContainerRef} - application root view component ref
*/
public getRootViewContainerRef():ViewContainerRef {
// The only way for now (by @mhevery)
// https://github.com/angular/angular/issues/6446#issuecomment-173459525
const appInstance = this.applicationRef.components[0].instance;
if (!appInstance.viewContainerRef) {
const appName = this.applicationRef.componentTypes[0].name;
throw new Error(`Missing 'viewContainerRef' declaration in ${appName} constructor`);
// https://github.com/angular/angular/issues/9293
const comps = this.applicationRef.components;

if(!comps.length) {
throw new Error(`ApplicationRef instance not found`);
}

try {
/* one more ugly hack, read issue above for details */
const root = (this.applicationRef as any )._rootComponents[0];
return root._hostElement.vcRef;
} catch (e) {
throw new Error(`ApplicationRef instance not found`);
}
return appInstance.viewContainerRef;
}

/**
Expand Down

2 comments on commit 99f15c8

@roswah
Copy link

@roswah roswah commented on 99f15c8 Oct 6, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the fix above will not work for us in our ng1 + ng2-app because when I debug and come to the method "getRootViewContainerRef()" inside "components-helper.service.ts I see that everything in this.applicationRef is emtpy. Both components and _rootComponents. We have not used the required hack. Should we use it anyway or is there another way to go around this?

@valorkin
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I need your root view container ref to attach component there :(

Please sign in to comment.