对话框的 Url 不适用于 angular.bootstrap （无限 $digest 循环）

我有一个平均堆栈网站。我想用执行函数 https://stackoverflow.com/a/45428344/702977绑定一个按钮以在对话框中启动该网站：

function doSomethingAndShowDialog(event) {
    clickEvent = event;
    Office.context.ui.displayDialogAsync("https://localhost:3000/try", {}, function () {})
}

单击该按钮将打开一个包含以下 url 的对话框，它确实显示了页面的内容：

https://localhost:3000/try?_host_Info=excel|web|16.00|en-us|7fe9b4e9-d51e-bea5-d194-c817bc5ed4bc|isDialog#%2Ftry%3F_host_Info=excel%7Cweb%7C16.00%7Cen-us%7C7fe9b4e9-d51e-bea5-d194-c817bc5ed4bc%7CisDialog

但是，在控制台中，有错误：$rootScope:infdig 无限 $digest 循环 https://docs.angularjs.org/error/%24rootScope/infdig at angular.bootstrap(document, ['myapp']):

var wait = setTimeout(myFunction, 1000);
Office.initialize = function (reason) {
    $(document).ready(function () {
        angular.bootstrap(document, ['myapp']) 
        console.log("bootstrapped inside Office.initialize");
        clearTimeout(wait);
    })
}

function myFunction () {
    $(document).ready(function () {
        angular.bootstrap(document, ['myapp']) 
        console.log("bootstrapped outside Office.initialize");
    })
}

app = angular.module("myapp", []);
app.config(...);
app.controller(...);

如果我们只是打开https://localhost:3000/try在浏览器中，没有错误。

有谁知道为什么那个长网址不起作用angular.bootstrap？我们该如何解决这个问题？

Edit 1:控制台的屏幕截图https://localhost:3000/try?_host_Info=excel...。请注意，两者都不是bootstrapped inside Office.initialize nor bootstrapped outside Office.initialize被展示。但如果我跑https://localhost:3000/try在浏览器中，我只会看到bootstrapped outside Office.initialize，当我从 Excel 客户端调用它时，我只会看到bootstrapped inside Office.initialize.

听起来您正在尝试连接一个可以作为加载项或独立页面运行的页面。只要有可能，最好为每个用例维护单独的视图。如果不出意外的话，它会让一切变得更加简单。将它们结合起来可能会产生更多的开销和令人头痛的问题。

这里的部分问题是您有两个单独的代码路径，并且您假设一次只会执行一个路径。当在浏览器中加载时，这是真的，它将简单地忽略 Office.initialize 函数。然而，当在 Office 中加载时，它将执行这两个路径。一个将由 Office 执行，另一个将由setTimeOut1秒后。

如果您有两个不同的代码路径，其中仅执行一个，则需要进行测试以确定您是作为加载项运行还是作为独立页面运行。这就是这些查询参数发挥作用的地方。如果你有一个_host_Info定义查询参数后，您将在 Office 中进行操作。例如：

if (getParameterByName('_hostInfo')) { // _hostInfo is defined
    Office.initialize = function (reason) {
        $(document).ready(function () {
            angular.bootstrap(document, ['myapp'])
            console.log("bootstrapped inside Office.initialize");
        });
    }
} 
else { // _hostInfo is not defined
    $(document).ready(function () {
        angular.bootstrap(document, ['myapp'])
        console.log("bootstrapped outside Office.initialize");
    })
}

注意getParameterByName()这是一个从中提取的函数这个答案 https://stackoverflow.com/a/901144/105518。不过，您可以使用任何您喜欢的方法。