Question

从我的angularjs应用程序中，打开一个新窗口：

 $window.open($state.href('catalog-detalleTicketMapa', {
      id: $localStorage.idRamdom
    }), 'window', 'height=700,width=700');

当我关闭新窗口时，我希望父窗口了解该事件，然后执行以下操作

// controller auxiliary window
vm.onExit = function () {
  $rootScope.$broadcast('ventanaCerrada');
};

$window.onbeforeunload = vm.onExit;

// controller main windows
$scope.$on('ventanaCerrada', function () {
  $rootScope.ventanaAbierta = false;
});

如果进入事件$ rootScope。$ broadcast但未进入事件范围。$ on。

我还对localStorage进行了测试，但仅在辅助窗口中进行了更新，而主窗口未进行更新。

如何在浏览器中同时在两个打开的窗口之间共享变量？

Answer 1

当您使用$window.open打开一个新窗口时，它不会与调用窗口共享作用域，因此（afaik）无法以角度广播它们之间的任何内容。但是调用窗口可以访问打开的窗口中的全局变量，因此我正在使用类似观察器的方式来监视该变量。

我在WindowService中有以下代码来打开新窗口（我们只打开一个窗口；如果需要更多，则需要调整代码）：

angular.module('myproject')
.service('WindowService', ['$window', '$interval', '$timeout', 
function ($window, $interval, $timeout) {

    var self = this;
    this.myOpenWindow = null;

    // opens a window and starts the wait-function
    this.openWindow = function (url, callbackFn) {
        // open the window
        self.myOpenWindow = $window.open(url);

        // Puts focus on the new window
        if (window.focus) {
            self.myOpenWindow.focus();
        }

        // check for response in opened window
        self.waitForResponse(callbackFn);
    };

    this.waitStarted = false;

    this.waitForResponse = function (callbackFn) {
        if (!self.waitStarted && self.myOpenWindow) {
            self.waitStarted = true;
            var intervalPeriod = 1000; // check once every second
            var waitHandler;
            waitHandler = $interval(function (index) {
                if (self.myOpenWindow.closed) {
                    // window was closed, commence cleaning operation
                    $interval.cancel(waitHandler);
                    waitHandler = $timeout(function () {
                        // re-initialize waitStarted so it can be used again
                        self.waitStarted = false;
                        // call callback-Function when the window is closed
                        if (callbackFn) {
                            callbackFn();
                        }
                    }, intervalPeriod);

                } else {
                    // window is still open, check if the observed variable is set 
                    if (self.myOpenWindow && self.myOpenWindow.response_message) {
                        var message = self.myOpenWindow.response_message;
                        // do what you want with the message
                        // ...
                        // afterwards close the window (or whatever)
                        if (self.myOpenWindow) {
                            self.myOpenWindow.close();
                        }
                    }
                }
            }, intervalPeriod);
        }
    };
}
]);

在打开的窗口中，您需要将该全局变量设置在某个位置，例如像这样：

window['response_message'] = { 'result': 'Done' };

Answer 2

通常，您不能在两个窗口之间共享存储数据。如果您确实需要一个窗口中的数据更改反映在另一个窗口中，请使用套接字或firebase来获取实时数据。

在两个窗口之间共享变量。 AngularJS

2 个答案: