如何使用angularJS将数据从主窗口传递到chrome应用程序中新创建的窗口？答案

【问题标题】：How to pass data from main window to newly created window in chrome app with angularJS?如何使用angularJS将数据从主窗口传递到chrome应用程序中新创建的窗口？
【发布时间】：2015-03-07 14:23:13
【问题描述】：

我目前正在创建一个 chrome 应用程序，只是为了好玩和学习，然后我遇到了一个问题。在主窗口中，我创建了一个窗口，该窗口将显示您单击的名称的对话，但我不知道如何将数据传递到该新窗口。可能吗？如果那样，怎么办？这是我的代码。

    chrome.app.window.create('views/templates/chatWindow.html', {
        'bounds': {
            'width': window.screen.availWidth,
            'height': window.screen.availWidth
        },
        state: 'maximized',
        resizable: false
    });

请注意，我正在使用 AngularJS，并且正在使用 Windows 机器。

另外，我还有一个问题。那个新窗口有它自己的控制器，那么，我如何获取传递的数据呢？

【问题讨论】：

您可以尝试following 上的在窗口之间传递数据部分。希望这可以帮助。 :)

标签： javascript windows angularjs google-chrome google-chrome-app

【解决方案1】：

聚会有点晚了，但我希望这个答案能帮助其他人解决这个问题：

如果您使用chrome.windows.create(https://developer.chrome.com/extensions/windows#method-create) 创建了子窗口，则可以使用 Chrome 的消息传递 API 将消息传递到这个新创建的子窗口：

在您的父级（后台脚本）中，您可以执行以下操作：

chrome.runtime.sendmessage({
  type: "a_message_type",
  foo: "bar"
});

在你的子窗口的 HTML 里面，你会有一些看起来像这样的代码：

<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Child Window</title>
  <script src="jquery-3.5.1.min.js"></script>
  <script src="child.js"></script>
</head>
<body>
  <p> I'm the child window </p>
</body>
</html>

在 child.js 中，您可以收听来自父级的消息：

$(function () {
  chrome.runtime.onMessage.addListener(function (request) {
    if (request.type === "a_message_type") {
      console.log(request.foo); // request has the payload from the parent window
    }
  });
});

【讨论】：

【解决方案2】：

选项 1

chrome.app.window.create 的回调函数为您提供AppWindow 对象作为回报。此对象具有 contentWindow 属性，该属性是新创建的窗口中的 window 对象。有了这个引用，您可以在 document.body 对象上触发一个自定义事件并在您的控制器中处理它。

选项 2

使用 Angular 的 NgRoute 和 URL 的哈希来传递数据。例如，您可以执行以下操作：

chrome.app.window.create('views/templates/chatWindow.html#/client/1234' //...

然后使用路由器和同一个应用的代码来处理视图和操作。

【讨论】：

抱歉我的回复晚了。我尝试了解决方案＃1，因为我没有使用 ngRoute。我已经在 chrome 应用程序的文档中看到了，但我不明白如何使用它，然后你给了我一个想法。谢谢
其实你根本不需要使用ngRoute。在应用程序的引导期间，您可以检查 $window.location.hash 属性并根据参数决定要运行应用程序的哪个部分。