9

I am using the Clarity Signposts and need its state (whether its open or closed). I am using the *clrIfOpen structural directive and have assigned it the isOpen variable. isOpen is false initially but should update to true when the Signpost is open.

<clr-signpost>
    <clr-signpost-content *clrIfOpen="isOpen">
        <p>Signpost Content!</p>
        <span>Signpost State: {{isOpen}}</span>
    </clr-signpost-content>
</clr-signpost>

I also tried the clrIfOpenChange output on clrIfOpen but it too is not triggered when the signpost is opened.

Clarity Version: 0.10.0-rc.1

Plnkr: https://plnkr.co/edit/OQupObBd9OkJZSpOhpfq?p=preview

Mike Donkers
  • 3,589
  • 2
  • 21
  • 34
Ruan Mendes
  • 90,375
  • 31
  • 153
  • 217

1 Answers1

6

I believe what you want to use is the de-sugared syntax of Angular structural directives to access the Output Emitter.

<clr-signpost>
  <ng-template [(clrIfOpen)]="isOpen">
    <clr-signpost-content>
      <p>Signpost Content!</p>
      <span>Signpost State: {{isOpen}}</span>
    </clr-signpost-content>
  </ng-template>
</clr-signpost>

Please refer to this Plnkr: https://plnkr.co/edit/SZNDZIiyomGWJsC7UsiC?p=preview

takeradi
  • 3,661
  • 7
  • 29
  • 53