Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fr(MatTooltip): Allow for template content/html #19367

Closed
WynieCronje opened this issue May 15, 2020 · 2 comments
Closed

fr(MatTooltip): Allow for template content/html #19367

WynieCronje opened this issue May 15, 2020 · 2 comments
Labels
feature This issue represents a new feature or feature request rather than a bug or bug fix

Comments

@WynieCronje
Copy link

WynieCronje commented May 15, 2020

Feature Description

Allow for HTML/Dynamic content inside MatTooltip with use of ng-template

Use Case

In my case. I show on a disabled button a tooltip explaining why the button is disabled. For this HTML and Binding is required inside the tooltip.

something like:

<button mat-raised-button
        matTooltip="disabledReasons"
        [matTooltipDisabled]="!buttonDisabled">
  Submit
</button>

<ng-template #disabledReasons>
   ...
</ng-template> 

----- OR -------

<button mat-raised-button
        matTooltip
        [matTooltipDisabled]="!buttonDisabled">

<ng-template mat-tooltip-content>
   ...
</ng-template> 
  Submit
</button>
@WynieCronje WynieCronje added feature This issue represents a new feature or feature request rather than a bug or bug fix needs triage This issue needs to be triaged by the team labels May 15, 2020
@jelbourn
Copy link
Member

For accessibility purposes, tooltips can only contain plain text and not complex html content

@mmalerba mmalerba removed the needs triage This issue needs to be triaged by the team label Jun 5, 2020
@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Jul 6, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
feature This issue represents a new feature or feature request rather than a bug or bug fix
Projects
None yet
Development

No branches or pull requests

3 participants