Name: Word-Add-in-Angular2-StyleChecker
Owner: Office Developer
Description: Office Word web add-in that uses the LocationRelation and compareLocationWith APIs of the Word JavaScript APIs to perform a search and replace that skips some ranges based on their location relative to other ranges. The add-in is built on the Angular 2.0 framework, and it also shows how to use the design samples from [Office Add-in UX Design Patterns Code](https://github.com/OfficeDev/Office-Add-in-UX-Design-Patterns-Code).
Created: 2016-08-09 18:08:27.0
Updated: 2018-05-06 08:29:55.0
Pushed: 2018-01-31 20:26:14.0
Size: 182
Language: JavaScript
GitHub Committers
| User | Most Recent Commit | # Commits |
|---|
Other Committers
| User | Most Recent Commit | # Commits |
|---|
Learn how to create an add-in that uses the LocationRelation and compareLocationWith APIs of the Word JavaScript APIs to perform a search and replace that skips some ranges based on their location relative to other ranges. The add-in is built on the Angular 2.0 framework, and it also shows how to use the design samples from Office Add-in UX Design Patterns Code.
August 1, 2016:
September 15 - October 17th, 2016:
In the folder where you want to put the project, run the following commands in the git bash shell:
Set the certificate to be a trusted root authority. On a Windows machine, these are the steps:
Now you need to let Microsoft Word know where to find the add-in.
`npm start` to start the web service. Leave the command window open.`https://localhost:3000` in the address box. If you do not receive any warnings about the certificate, close the browser and continue with the section below titled Start the add-in. If you do receive a warning that the certificate is not trusted, continue with the following steps:Restart Word and open a Word document.
On the Insert tab in Word 2016, choose My Add-ins.
Select the SHARED FOLDER tab.
Choose Style Checker, and then select OK.
If add-in commands are supported by your version of Word, the UI will inform you that the add-in was loaded.
On the Home ribbon is a new group called Style Checker with a button labeled Show and a blue pencil icon. Click that button and the add-in will open to a page of instructions.
Note: The add-in will load in a task pane if add-in commands are not supported by your version of Word.
When you are finished with the instructions, click Get Started.
When the Find and Replace page opens, there is a command bar at the top with a menu button. Click the button to open the menu.
Select Insert sample content. Click the button again to close the menu. The document now has unformatted text about Office Add-ins, including a fictional quotation. The writer has used an “OAI” to abbreviate “Office Add-in” and so does the anonymous quotation.
In the Find box enter “OAI”.
In the Replace box enter “Office Add-in”.
The change should not be made in the paragraph that is a direct quotation, so enter the number 2 in the Skip Paragraph Number box. This is the zero-based number of the paragraph.
Select Replace. Every instance of “OAI” except the one in the skipped paragraph is changed.
Experiment with other search and replace strings.
Note: This sample add-in accepts only one number in the Skip Paragraph Number box. A production add-in would allow multiple paragraphs to be skipped and would have additional ways of designating which paragraphs should be skipped; such as skipping based on paragraph style.
All of the code that uses the Office and Word JavaScript APIs is in the file word.document.service.ts. The compareLocationWith() method that this sample demonstrates is in the replaceFoundStringsWithExceptions() method.
The code first gets a collection of all the ranges that match the user's search term. It then gets a collection of all the paragraph ranges in the document.
After the collections are loaded with a call of context.sync(), the code creates an array of the paragraph ranges that the user excludes from the replacement. (Note that excludedParagraph is a parameter passed to the method.)
The code then loops through the iterables to determine which search results are inside excluded paragraphs and which are not. For each search result, this fact is recorded in a IReplacementCandidate object. The compareLocationWith() method returns “Inside” if the search result is inside the excluded paragraph. It returns “Equal” if the search result is a paragraph by itself and has been excluded.
(let i = 0; i < foundItems.items.length; i++) {
for (let j = 0; j < excludedRanges.length; j++) {
replacementCandidates.push({
range: foundItems.items[i],
locationRelation: foundItems.items[i].compareLocationWith(excludedRanges[j])
});
}
The replacement candidate objects are loaded with a call to context.sync() and then the code iterates through them, replacing the search string with the replace string only in the paragraphs which are not in an excluded paragraph.
acementCandidates.forEach(function (item) {
switch (item.locationRelation.value) {
case "Inside":
case "Equal":
break;
default:
item.range.insertText(replaceString, 'Replace');
}
See the replaceDocumentContent method of the same file to see how the Word insertText and nsertParagraph methods are used to insert sample content into the document.
See the rest of the code files to see how the design patterns from Office Add-in UX Design Patterns Code have been integrated into the Angular 2.0 framework.
We'd love to get your feedback about this sample. You can send your feedback to us in the Issues section of this repository.
Questions about Microsoft Office 365 development in general should be posted to Stack Overflow. If your question is about the Office JavaScript APIs, make sure that your questions are tagged with [office-js] and [API].
Copyright (c) 2016 Microsoft Corporation. All rights reserved.
This project has adopted the Microsoft Open Source Code of Conduct. For more information, see the Code of Conduct FAQ or contact opencode@microsoft.com with any additional questions or comments.