This package has been deprecated

Author message:

Version no longer supported. Use @angular-ru/cdk/tooltip instead

@angular-ru/tooltip
TypeScript icon, indicating that this package has built-in type declarations

15.304.0 • Public • Published

Tooltip directive for your Angular app

npm version npm-stat

Introduction

Demo: https://angular-ru.github.io/angular-ru-tooltip-example-app/

$ npm install @angular-ru/tooltip
  • Add styles to styles.scss file:
@import '~@angular-ru/tooltip/styles';

// ...
import { TooltipModule } from '@angular-ru/tooltip';
import { NgModule } from '@angular/core';

@NgModule({
    imports: [
        // ...
        TooltipModule.forRoot()
    ]
})
export class AppModule {}

Basic example

<div tooltip="Bottom" tooltip-placement="bottom">Bottom</div>
<div tooltip="Right" tooltip-placement="right">Right</div>
<div tooltip="Left" tooltip-placement="left">Left</div>
<div tooltip="Top" tooltip-placement="top">Top</div>

The value of option '[tooltip-placement]' by default is 'top'.

A custom template for the tooltip (html)

<div [tooltip]="tooltipTemplate" [tooltip-context]="{ name: 'Max' }" tooltip-placement="bottom">Bottom with HTML</div>

<ng-template #tooltipTemplate let-context>
    <span style="text-decoration: underline; color: yellow">Hello {{ context.name }}</span>
</ng-template>

Readme

Keywords

none

Package Sidebar

Install

npm i @angular-ru/tooltip

Weekly Downloads

1

Version

15.304.0

License

MIT

Unpacked Size

231 kB

Total Files

40

Last publish

Collaborators

  • angular-ru