我想构建一个带有角度和角度UI路由器的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的正确方法是什么？因此，许多随机的奇怪行为发生了......
控制台 ttt 显示两次的原因是我同时有<body ng-app="myApp">和 angular.bootstrap。
如果我从Office.initialize中删除angular.element(document(.ready(...(，控制台ttt只能正确显示一次。但是，当打开另一个与Excel交互的页面时，我收到一个错误：Office.context未定义。
我还没有测试过，但是完全删除Office.initialize块并保留<body ng-app="myApp">可能会解决问题......
正确的方法是您必须在Office中手动启动AngularJS应用程序。
路由配置.js
Office.initialize = function () {
//load angular app after office has been initialized
angular.bootstrap($('#TSRApp'), ['TSRApp']);
}
var app = angular.module("TSRApp", ["ngRoute"]);
app.config(function ($routeProvider) {
$routeProvider
.when("/", {
templateUrl: "../Home/Index.html"
})
.when("/settings", {
templateUrl: "../Settings/Index.html"
})
.when("/message", {
templateUrl: "../MessageRead/MessageRead.html"
});
});