ckd-overlay-container is not working when opened in window popup

443 Views Asked by At

I am opening angular2 component from angularjs as angularjs one is my legacy application and i have a requirement where I need to show some new angular2 component in a window. I found a solution for that using which I am able open a new window with this component.

angular.module('myModule').factory('popupWindow', ['$rootScope', '$compile', '$window',
        function ($rootScope, $compile, $window) {
            var html = '<survey></survey>';
            var link = $compile(html); // note that compilation happens only once

            return {
                open: function () {
                    var scope = $rootScope.$new(true);

                    var w = $window.open('', '_blank', 'toolbar=0,width=1250,height=600');
                    copyStyles(document, w.document);

                    // using a cloneAttachFunction, cf. the docs and http://stackoverflow.com/questions/18064543/compile-angular-on-an-element-after-angular-compilation-has-already-happened
                    link(scope, function (cloned, scope) {                            
                        angular.element(w.document.body).append(cloned);                           
                    });
                }
            };
        }]);

But I am running into another issue now. This component have md-autocomplete and when I click on it opens md-options but they are tied to parent main application When I looked at developer tools cdk-overlay-container is attached to the parent application instead of child window opened from it. Any solution for this ? https://material.angularjs.org/latest/ is used in this. image attached here

0

There are 0 best solutions below