Office Addin Angular с помощью функции поиска в Word по HTML, после использования функции get Html () или поддержки API по умолчанию для этого

Question

Я разрабатываю office word addin с использованием Angular, и мне удалось его создать. Я получаю HTML с некоторыми классами, назначенными с определенным уникальным идентификатором для DIV и SPAN, из моего API.

Например:

<span class="tip tip-5d4949a499b39510a0ea3676" id="tip-66b92187-d901-4366-99f4-417f20de60a1">nun</span>

Теперь я загрузил этот недавно полученный HTML к слову следующим образом после первой очистки содержимого.

Очистить HTML:

clearContentsOfWord() {
    Word.run(function (context) {
      var body = context.document.body;
      body.clear();
      return context.sync().then(function () {
        console.log('Cleared the body contents.');
      });
    })
      .catch(function (error) {
        console.log("Error: " + JSON.stringify(error));
        if (error instanceof OfficeExtension.Error) {
          console.log("Debug info: " + JSON.stringify(error.debugInfo));
        }
      });
  }

Назначить новый HTML:

setNewContentsInWord(html: string) {
    Word.run(function (context) {
      var body = context.document.body;
      body.insertHtml(html, Word.InsertLocation.start);
      return context.sync().then(function () {
        console.log('HTML added to the beginning of the document body.');
      });
    })
      .catch(function (error) {
        console.log('Error: ' + JSON.stringify(error));
        if (error instanceof OfficeExtension.Error) {
          console.log('Debug info: ' + JSON.stringify(error.debugInfo));
        }
      });
  }

Теперь у меня есть функция поиска, реализованная следующим образом. Основная идея c состоит в том, чтобы найти элемент и выделить его.

assignColorToTheWord(color: string, search: string) {
    if (search) {
      Word.run((context) => {
        const searchResults = context.document.body.search(search);
        context.load(searchResults, 'font');
        return context.sync().then(function () {
          for (var i = 0; i < searchResults.items.length; i++) {
            searchResults.items[i].font.highlightColor = color;
          }
          return context.sync();
        });
      })
        .catch(function (error) {
          console.log('Error: ' + JSON.stringify(error));
          if (error instanceof OfficeExtension.Error) {
            console.log('Debug info: ' + JSON.stringify(error.debugInfo));
          }
        });
    }
  }

Проблема с этим подходом состоит в том, что я не получаю результаты, если я ищу с полным HTML или с идентификатор класса <span class="tip tip-5d4949a499b39510a0ea3676" id="tip-66b92187-d901-4366-99f4-417f20de60a1">nun</span>, но при поиске по тексту nun он дает результат.

В слове document будет много таких слов (nun), мне нужно было убедиться, что я выделите правильный. Я также знал, что API поиска имеет ограничение на количество символов для поиска , как я могу это преодолеть?

Я также открыл новый выпуск в GitHub, вы можете найти, что здесь .

Как я могу это сделать? Вы когда-нибудь делали что-то подобное?