對話框的Url不適用於angular.bootstrap（無限$ digest循環）

Question

我有一個平均堆棧網站。我想用ExecuteFunction綁定一個按鈕，在對話框中推出這個網站：

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

點擊按鈕將打開以下網址一個對話框，它顯示頁面的內容：

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 

然而，在控制檯中，有在angular.bootstrap(document, ['myapp'])是Error: $rootScope:infdig Infinite $digest Loop：

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 r，沒有錯誤。

有誰知道爲什麼這個長的網址不適用於angular.bootstrap？我們如何解決這個問題？

編輯1：控制檯的屏幕截圖https://localhost:3000/try?_host_Info=excel...。請注意，不會顯示bootstrapped inside Office.initialize和bootstrapped outside Office.initialize。但是，如果我在瀏覽器中運行https://localhost:3000/try，我將只能看到bootstrapped outside Office.initialize，當我從Excel客戶端調用它時，我將只看到bootstrapped inside Office.initialize。

Answer 1

這聽起來像你試圖要連接的是可以作爲一個附加的或獨立的頁面操作頁面。只要有可能，最好爲每個用例維護單獨的視圖。如果沒有別的東西，它會讓所有事情變得更直接。把它們結合起來可能會造成更多的開銷和頭痛，這是值得的。

這裏的問題的一部分是，你有兩個獨立的代碼路徑，你假設一次只能執行一個路徑。當在瀏覽器中加載時，它將會忽略Office.initialize函數。當在Office中加載時，它將執行兩個路徑。一個將由Office執行，另一個將在1秒後由setTimeOut執行。

如果您有兩個不同的代碼路徑，其中只有一個執行過，則需要測試以確定您是作爲加載項運行還是作爲獨立頁運行。這是查詢參數起作用的地方。如果您有定義的_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()這裏是this answer拉的功能。你可以使用任何你喜歡的方法。