I would like to have tooltip appear only if incoming string length is > 35
and also if that is the case add ellipses [...] at the end of the string, I
am using angular 6

my main component.html file as below

<tr *ngFor = "let data of datas" ><td><span [ngbTooltip]
="showTooltip">{{data.name}}</span></td><ng-template #showTooltip>
      <my-tooltip [data]="data.name"></my-tooltip></ng-template></tr>

In My Tooltip component.ts file

import { Component, Input, OnInit } from '@angular/core';
@Component({
  selector: 'my-tooltip',
  templateUrl: './tooltip.component.html'})export class
ToolTipComponent implements OnInit {
  @Input() data: any;

  ngOnInit(){
      console.log("tooltip" + this.data);
  }
}

in tooltip.component.html

<div class="tooltip">{{data}}</div>

However the result display black small box without any data into it.

What is missing here, if anyone can look into this, also I need to add
elipses if incoming string is more then 35 characters and then and then
tooltip should be displayed.


-- 
Sent from my mi note 4 phone.

-- 
You received this message because you are subscribed to the Google Groups 
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to angular+unsubscr...@googlegroups.com.
To post to this group, send email to angular@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/angular/CAKVZMjCTR61nqZwkSh1pyy2O2WFsz0U9OGKT00F0DnYZjm5LUw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to