In my page Stock I have several fields with a title named Title 1.

If I do a console.log I am on my first page !

ngOnInit() {
    this.currentPortfolio = this.shrd.getData('currentPortfolio');
    this.subPage = 'stocks';
    this.sectionTitle = "";
    this.pageTitle = "Options";
    for (var i = 0; i < this.optionsDropdownFilters.length; i++) {
        this.issuers.actionsGrouped[this.optionsDropdownFilters[i]] = [];
    }

    console.log("First page => Tile 1 : " + JSON.stringify(this.subPage = 'stocks'));
    this.initiate();
}

In Google Chrome I have this:

Now, I click on the button Search in my page Stock... I want to change Title1 to Title2.

If I do a console.log, I am on my second page

launchSearchSelected(t) {
    this.searched = true;
    this.dateNotValid = false;
    this.dateDoesntExist = false;
    if (this.search.equityDate.length == 0) {
        this.dateDoesntExist = true
    }
    if (t == 'A' && this.search.equityOptionCode > 0 && this.search.equityDate.length > 0) {
        this.launchSearchResult(t, this.search.equityOptionCode, this.search.equityDate);
    } else if (t == 'I' && this.search.indexOptionCode.length > 0 && this.search.indexDate.length > 0) {
        this.launchSearchResult(t, this.search.indexOptionCode, this.search.indexDate);
    }
    console.log("Second Page => Title 2 " + JSON.stringify(this.searched = true));
}

In my HTML, I don't understand how can I switch from one title to another with the boolean?

<ng-container *ngIf="subPage  === 'stocks' ">
   <div class="breadcrumb d-flex justify-content-between">
      <h1>Title 1  </h1>
   </div>
</ng-container>