使用angularjs在Office加載項中正確使用Office.initialize的方法

我想使用angular和angular-ui-router構建Office加載項。我不知道Office.initialize的正確位置。使用angularjs在Office加載項中正確使用Office.initialize的方法

此刻，我在index.html使用：

<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script> 
<script src="https://cdn.rawgit.com/devote/HTML5-History-API/master/history.js"></script> 
<script src="/javascripts/angularApp.js"></script> 
... 
<body ng-app="myApp"> 
    <ui-view ng-cloak></ui-view> 
</body>

而且angularApp.js：

Office.initialize = function (reason) { 
    $(document).ready(function() { 
     angular.element(document).ready(function() { 
      angular.bootstrap(document, ['myApp']) 
     }) 
    }); 
} 

var app = angular.module('myApp', ['ui.router', 'ui.bootstrap']) 

app.config(['$stateProvider', function ($stateProvider) { 
    $stateProvider 
     .state('ttt', { 
      url: '/ttt', 
      template: 'ttt', 
      controller: 'tttCtrl' 
     }) 
     .state('addinTest', { 
      url: '/addin/test', 
      template: '<a href="ttt" target="_self">ttt</a><br/><br/><a href="addin/another" target="_self">another page</a>' 
     }) 
}]) 

app.controller('tttCtrl', [function() { 
    console.log('console ttt') 
}])

而且manifest.xml：

<bt:Url id="Contoso.Taskpane3.Url" DefaultValue="https://localhost:3000/addin/test" />

所以加載外接顯示test頁面2個按鈕。點擊ttt加載ttt頁面。 但是，我的測試顯示console ttt顯示兩次。

如果我從Office.initialize刪除angular.element(document).ready(...)，則console ttt只能正確顯示一次。但是，在打開與Excel交互的頁面another時，出現錯誤：Office.context is undefined。

那麼誰能告訴我，我們是否應該使用angular.bootstrap(...)？在angularjs的Office加載項中做Office.initialize的正確方法是什麼？很多隨機奇怪的行爲發生，因爲這...

來源

2017-07-08 SoftTimur

控制檯ttt顯示兩次的原因是我有<body ng-app="myApp">和angular.bootstrap在同一時間。

If I remove angular.element(document).ready(...) from Office.initialize, console ttt is correctly displayed only once. However, when opening another page which interacts with Excel, I got an error: Office.context is undefined.

我沒有測試過，但完全去除Office.initialize塊，並保持<body ng-app="myApp">可能會解決問題...

來源

2018-01-02 05:34:00 SoftTimur

使用angularjs在Office加載項中正確使用Office.initialize的方法

回答

相關問題