How to close sign post content using directive *clrIfOpen

Question

I am using clarity signpost, I am using this signpost for showing multiple applications, how to close this sign post when i am click on the application.

For example I am adding three buttons in this sign post, if I click on the button this need to be close. Please check my stackblitz

Answer 1

To keep track of whether the signpost is open or not, and then be able to dynamically close it, you should use the de-sugarized syntax of clrIfOpen to utilize two-way binding:

<ng-template [(clrIfOpen)]="signPost">
  <clr-signpost-content>
    <button class="btn btn-outline" (click)="close()">Hr</button>
    ...
  </clr-signpost-content>
</ng-template>

Here is your example with this change, working fine: https://stackblitz.com/edit/signpost-dynamic-close?file=src/app/app.component.html