Я хочу переключаться между вкладками навигации из машинописи

Question

У меня есть две вкладки, 1) Аннотация и 2) Строка данных. во вкладках навигации

    <nav>
       <div class="nav nav-tabs nav-fill " id="nav-tab2 " role="tablist ">
            <a class="nav-item nav-link active" id="nav-annotations-tab" data-toggle="tab" href="#nav-annotations" role="tab">Annotations</a>
            <a class="nav-item nav-link" id="nav-datastringbox-tab" data-toggle="tab" href="#nav-datastringbox" role="tab">String</a>
      </div>
    </nav>

И соответствующие дивы следующие:

    <div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent2">
         <div class="tab-pane fade show active" id="nav-annotations">
              <app-pvgfp-annotation-list></app-pvgfp-annotation-list>
         </div>
         <div class="tab-pane fade" id="nav-datastringbox">
              <div class="line-loader " [hidden]="!lineLoader"></div>
                   <textarea rows="5 " class="form-control"> 
                   </textarea>
              </div>
         </div>
    </div>

И компонент списка аннотаций состоит из нескольких тегов a, каждый из которых состоит из нескольких ссылок. который (компонент app-pvgfp-annotation-list) выглядит следующим образом:

    <div>
        <a href="htts://www.google.com">Google</a>
        <a href="https://www.facebook.com">Facebook</a>
    </div>

Теперь я хочу, при нажатии на эту ссылку я должен открыть вкладку # nav-datastringbox.

Итак, в основном, мой вопрос заключается в том, как открыть другую вкладку из машинописного текста.

Может кто-нибудь, пожалуйста, помогите мне решить эту проблему.