Components: MatTooltipDisabled don't work if change on click button event

[YoannBureau]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

I have a disabled (disabled = true) tooltip on a button. When I click on the button, I change the disabled state to false and after a few seconds I change it back to true.
Expected: The tooltip should be showed for a few seconds, then disapear.

What is the current behavior?

The tooltip does not show. You have to leave the button with your mouse and hover it again to see the tooltip.

What are the steps to reproduce?

Here is a blitz that reproduces the problem:
https://stackblitz.com/edit/angular-material-copied-to-clipboard-tooltip?file=app%2Ftooltip-position-example.html

What is the use-case or motivation for changing an existing behavior?

For a copy to clipboard button, it is common to inform the user that the data has been copied to the clipboard.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 5.2.0
Angular Material 5.2.0

Is there anything else we should know?

[julianobrasil]

You can do it with the show and hide api methods:

@ViewChild(MatTooltip) _matTooltip: MatTooltip;

...

onCopyButtonClick() {
  this.copiedTooltipDisabled = false;
  setTimeout(() => this._matTooltip.show());
  setTimeout(() => {
    this.copiedTooltipDisabled = true;
    this._matTooltip.hide();
  }, 4000);
}

[josephperrott]

Closing as this is working as expected. If you would like to show and hide the tooltip programatically you should use the show/hide methods.

[YoannBureau]

Sorry to ask @julianobrasil but I'm trying to find the way to define a Viewchild for my tooltip with a specific name (I have several tooltips in my page), can you give me a snippet?

[julianobrasil]

The MatTooltip directive has an exportAs attribute (it's exported as "matTooltip"). You can check it without looking for it at the code, just reading the doc site at the API tab:

So, you can do something like this:

<button mat-button
        matTooltip="Look at this tip"
        #tp="matTooltip">
  Just click me
</button>

After that, you can get a reference to it by using the _template reference variable_ "tp".

@ViewChild('tp') _matTooltip: MatTooltip;

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}