AngularJS:打开一个新的浏览器窗口，但仍然保留范围和控制器，以及服务 [英] AngularJS: open a new browser window, yet still retain scope and controller, and services

问题描述

我正在编写一个 angularJS 应用程序.在这个特定的控制器中，我通过 $window.open 服务打开一个新的浏览器窗口.但是在新窗口中，所有的 $scope 变量都丢失了.

I'm writing an angularJS app. In this particular controller, I open a new browser window through the $window.open service. But in the new window, all the $scope variables are lost.

我尝试使用 window.parent 但这不起作用.事实上，在新的浏览器窗口中，所有的应用服务、控制器或作用域都没有生效，这是真的吗?有没有办法打开一个新的浏览器窗口，但仍然使新窗口属于旧窗口中的同一个 angular 应用程序?我需要访问一些 angularJS 服务和打开那个新窗口的控制器的范围.这可能吗?

I tried to use window.parent but this doesn't work. In fact in the new browser window all the app services, controllers, or scopes are not in effect at all, is this true? Is there a way to open a new browser window yet still makes the new window belongs to the same angular app in the old window? I need to have access to some angularJS services and the scope of the controller that open that new window. Is this possible at all?

推荐答案

没有[直接] 的方法让新窗口属于同一个 angular.js 应用程序，因为 angular 应用程序一般绑定到文档、窗口, 以及通过 ng-app 指令或调用 angular.bootstrap 对其进行初始化的窗口的事件.

There is no [straightforward] way to make the new window belong to the same angular.js application, since the angular application is generally tied to the document, window, and events of the window where it was initialized either via an ng-app directive or by calling angular.bootstrap.

但是，您可以为弹出窗口创建新的 angular 模块和应用程序.通过包含适当的 javascript 文件，您可以使用与原始应用程序相同的基本服务和控制器.

However, you can create a new angular module and application for your popup window. You could use the same basic services and controllers from your original application by including the appropriate javascript files.

假设您的弹出窗口需要来自原始应用程序的数据，您可以使用从 window.open() 方法返回的 window 对象传递该数据.例如，在你的第一个 Angular 应用程序中，像这样打开你的弹出窗口:

Presuming your popup window needs data from the original application, you can pass that by using the window object returned from the window.open() method. For example, within your first angular application, open your popup window like so:

angular.module('originalModule').service('popupService', function(someOtherDataService) {

  var popupWindow = window.open('popupWindow.html');
  popupWindow.mySharedData = someOtherDataService.importantData;

});

一旦您的辅助弹出式"angular 应用程序被初始化，它就可以通过读取 window.mySharedData 来引用共享数据.

Once your secondary "popup" angular application is initialized, it can then reference the shared data by reading window.mySharedData.

您还可以在每个窗口中创建可以从另一个窗口调用的函数.弹出窗口可以通过使用 window.opener 属性回调到原来的窗口.(window.parent指的是frame的父窗口，你要window.opener)

You can also create functions in each window that can be called from the other window. The popup window can call back into the original window by using the window.opener property. (window.parent refers to the parent window of frames, you want window.opener)

[同意，我相信如果您研究了 angular 源代码，您会找到一些聪明的方法来为两个窗口使用相同的 angular 应用程序.这样的尝试超出了我今晚的野心.]

[Agreed, I'm sure that if you studied the angular source code you could find some clever way to use the same angular app for both windows. Such an attempt is beyond my ambition this evening.]

这篇关于AngularJS:打开一个新的浏览器窗口，但仍然保留范围和控制器，以及服务的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！