Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
3.4k views
in Technique[技术] by (71.8m points)

javascript - Angular variables

I've got a line of text right now, and when that line of text is being overflown something gets set to true which let's me load in a tooltip! Code below:

Template

<div>
   <p #tooltip [tooltip]="/* ShowToolTipSomeHow? ? name : null */" delay="300">{{name}}</p>
</div>

This is where it should check if it should show the tooltip or not. As you can see it should somehow detect if the tooltip should be shown or not, I have no idea how and that's my question right now.

Component

@ViewChildren('tooltip') private tooltips!: QueryList<ElementRef>;

  ngAfterViewInit(): void {
    this.tooltips.changes.subscribe((tts: QueryList<ElementRef>) => {
      tts.forEach((tooltip, index) => {
        this.checkTooltipTruncated(tooltip);
      });
    });
  }

  private checkTooltipTruncated(tooltip: ElementRef) {
    // Checks if the text has overflown
    const truncated = this.isTextTruncated(tooltip);

    if (truncated) {
      // Change the ShowToolTipSomehow? value?
    }
  }

In the component it somehow changes some value that the tooltip can detect so that it can update itself to hide the tooltip. The additional problem is that it's not 1 tooltip to change, but infinite tooltips (so basically 1 or more).

My question is, how would I do this because I'm pretty stuck.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)
等待大神解答

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...