Ich möchte ein Office-Add-in mit eckigen und eckigen UI-Router erstellen. Ich weiß nicht, wo der richtige Platz ist, um Office.initialize zu setzen.Korrekter Weg zu Office.Initialize in Office-Add-Ins mit angularjs
Im Moment benutze ich in 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>
Und 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')
}])
Und manifest.xml:
<bt:Url id="Contoso.Taskpane3.Url" DefaultValue="https://localhost:3000/addin/test" />
den Add-In-Shows test Seite So lädt mit 2 Tasten. Klicken Sie auf ttt lädt ttt Seite. Mein Test zeigt jedoch, dass console ttt zweimal angezeigt wird.
Wenn ich angular.element(document).ready(...) von Office.initialize entferne, wird console ttt nur einmal korrekt angezeigt. Beim Öffnen der Seite another, die mit Excel interagiert, habe ich einen Fehler erhalten: Office.context is undefined.
Also könnte mir jemand sagen, ob wir angular.bootstrap(...) verwenden sollten? Und was ist der richtige Weg, Office.initialize in Office-Add-in mit angularjs zu tun? Viele zufällige ungerade Verhaltensweisen treten wegen dieses ... auf