Você está aprendendo
Ver documentação
Laboratório Angular: Criando uma Tooltip
Objetivo: 3 acertos
Prêmio: 1 conquista de Angular
Progresso atual:
Olá, bem vindo a sala Laboratório Angular: Criando uma Tooltip de Angular
Esta sala possui um pré-requisito recomendado
Clique no botão abaixo, desbloqueie conteúdos, exercícios e conquiste essa sala.
Obrigado pelo seu feedback.
Esta sala possui um pré-requisito recomendado
Conteúdo da sala
Sala
Documentação
Angular: Laboratório Angular: Criando uma Tooltip

Aprenda com essa sala a exibir ou esconder um elemento em resposta a um evento.

Faça com que a posição de um elemento seja igual a do mouse.

Características

  • É uma conversa entre dois elementos na página: um p.term e uma div.tooltip
  • Uso do event binding e o data binding
  • O estado de um componente é representado por suas propriedades
  • Controlamos quais classes um elemento deve receber ou renunciar por meio do class binding

Exemplo de código

export class TooltipExampleComponent {
  // quando o atributo visible é falso, o elemento perde a classe visible
  public visible = false;
  // método invocado sempre que o evento mouseover for emitido
  exibeTooltip() {
    this.visible = true;
  }
  // método que deixa o texto da Tooltip invisível na página
  escondeTooltip() {
    this.visible = false;
  }
}

O que eu preciso aprender?