جاوااسکریپت - کتابخانه Angular برای کشیدن خطوط بین اشیاء

من به دنبال یک بسته برای اضافه کردن به پروژهی انگولار خود هستم مانند این: https://anseki.github.io/leader-line/

من خواندهام که وارد کردن کتابخانههای جاوا اسکریپت وانیلا به یک پروژه تایپاسکریپت کار نسبتاً سختی است، بنابراین کنجکاو بودم که بدانم آیا کسی معادلی از این کتابخانه به صورت یک پکیج برای انگولار میشناسد. من آنلاین جستجو کردهام اما تاکنون موفق نشدهام.

پاسخ شماره ۱

مرحله ۱: نصب LeaderLine

npm i leader-line --save

مرحله ۲: آن را در angular.json وارد کنید

 "scripts": [
               "./node_modules/leader-line/leader-line.min.js"
            ],

مرحله ۳: وارد کردن leader-line، اعلام LeaderLine و وارد کردن سند

import { Component, Inject, OnInit } from '@angular/core';
import {DOCUMENT} from "@angular/common";
import 'leader-line';
declare let LeaderLine: any;

@Component({
  selector: 'my-app',
  template: '<div id="d1">div 1</div><div style="height:500px"><!-- JUST SOME SPACE --></div><div id="d2"> Connect me</div>',
})
export class AppComponent implements OnInit {

  constructor(@Inject(DOCUMENT) private document){
  }

  ngOnInit() {
    new LeaderLine(
      this.document.getElementById('d1'),
      this.document.getElementById('d2')
    );
  }
}

پاسخ شماره ۲

لطفاً دوباره راهاندازی کنید، به این صورت: اجرای ng serve --open، و همه چیز درست خواهد شد :)