Office web add-in : Office.initialize() function - ms-office

Question

I am struggling to understand, and don't find an example to exactly match what I am trying to achieve. Which is to have an MS Outlook ribbon bar icon, which when clicked displays a Dialogue Box. I played about with a demo, threw out superfluous functionality and got a Hello World going - but it is JQuery and I want to use to use AngularJs, to reuse much of an existing app.
Firstly, the example manifests all seem to have something like
<DesktopFormFactor>
<FunctionFile resid="functionFile" />
This seems to be for functions which are invoked when the user clicks an icon on the ribbon bar. Would I be correct to assume that I don't need that, if I just use a <script src=> tag to include an such files of functions?
My app will have only a single view, so whereas in the demo all *.js files have something like
// The Office initialize function must be run each time a new page is loaded
Office.initialize = function (reason) {
Would I be correct to assume that I need only have such call one, in the controller of my sole view?
Sorry if this seems pretty basic stuff, but all of the demos & docs seem to be close to what I want, but not exactly. Happy holidays!

Answer 1

Use of FunctionFile
FunctionFile specifies the source code file for operations that an add-in exposes through add-in commands(Ribbon buttons) that execute a JavaScript function instead of displaying UI.
Add-ins can decide either to display some UI in task pane or execute a javascript function in background. For UI-less add-ins, you will have to specify a FunctionFile.
In your case, FunctionFile can be ignored.
Use of Office.initialize
Office Add-ins include the Office.js library and the library expects your start-up code not to call any APIs until the library is fully loaded. There are two ways that your code can ensure that the library is loaded.
Use Office.initialize: An initialize event fires when the Office.js library is fully loaded and ready for user interaction. You can assign a handler to it.
Use Office.onReady: Office.onReady() is an asynchronous method that returns a Promise object while it checks to see if the Office.js library is fully loaded.
Examples:
Office.initialize = function () {
// Office is ready
};
Or
Office.onReady(function(info) {
if (info.host === Office.HostType.Outlook) {
// Based on host, decide what to display.
}
if (info.platform === Office.PlatformType.PC) {
// Make minor UI changes, if required.
}
});
In your case, you can use initialize/onReady once.