Получена «ошибка TS2304: не удается найти имя 'id'». при попытке протестировать пример "ngx-диаграммы" - PullRequest
0 голосов
/ 05 мая 2020

Я пытаюсь протестировать простой пример ngx-diagram отсюда: https://www.npmjs.com/package/ngx-diagram

Но когда я запускаю свой код, он выдает следующие сообщения об ошибках:

ERROR in src/app/app.component.ts:23:26 - error TS2304: Cannot find name 'id'.

23       this.nodes = [{id: id()}];
                            ~~
src/app/app.component.ts:25:23 - error TS2304: Cannot find name 'id'.

25           const idl = id();
                         ~~
src/app/app.component.ts:59:25 - error TS2304: Cannot find name 'id'.

59       const node = {id: id()};
                           ~~

Это файл .ts, который я использую:

import { Component, ViewChild } from '@angular/core';
import {NgxDiagramComponent} from 'ngx-diagram'


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})


export class AppComponent {
  @ViewChild('diagram' , {static:false})  diagram : NgxDiagramComponent;
  //title = 'ngx-diagram';

  selection = [];

  nodes = [];
  links = [];

  ngOnInit() {

      this.nodes = [{id: id()}];
      for (let i = 0; i < 10; i++) {
          const idl = id();
          this.nodes.push({id: idl});
      }

      this.nodes.forEach(source => {
          for (let i = 0; i < 1; i++) {
              const target = this.nodes[Math.floor(Math.random() * this.nodes.length)];
              if (source.id !== target.id) {
                  this.links.push({source: source.id, target: target.id});
              }
          }
      });

      this.diagram.updateNodes(this.nodes); // First the nodes then the links
      this.diagram.updateLinks(this.links);
      this.diagram.redraw();


  }

  connected(connection) {

      if (connection.source.id !== connection.target.id) {
          this.links.push({source: connection.source.id, target: connection.target.id});

          this.diagram.updateLinks(this.links);
          this.diagram.redraw();

      }

  }

  created(creation) {

      const node = {id: id()};
      this.nodes.push(node);

      this.diagram.updateNodes(this.nodes);
      this.diagram.moveNodeTo(node.id, creation.x, creation.y);
      this.diagram.redraw();

  }

  selected(selection) {

      this.selection = selection;

  }

  deleteSelected() {

      this.nodes = this.nodes.filter(node => !this.selection.find(n => node.id === n.id));
      this.links = this.links.filter(link => !(this.selection.find(n => link.source === n.id || link.target === n.id)));

      this.diagram.updateNodes(this.nodes);
      this.diagram.redraw();
      this.selection = [];

  }

  deleteLinksBetweenSelected() {

      this.links = this.links.filter(link => !(this.selection.find(n => link.source === n.id) && this.selection.find(n => link.target === n.id)));

      this.diagram.updateLinks(this.links);
      this.diagram.redraw();

  }

  autoLayout() {
      this.diagram.autoLayout().then();
  }

}

1 Ответ

0 голосов
/ 05 мая 2020

Очень странный пример использования библиотеки (на странице библиотеки на github). Я думаю, что id () - это функция, генерирующая случайную строку и возвращающая ее, но автор ngx-диаграмм не упомянул об этом. Попробуйте заменить id() на this.id(). А затем создайте функцию, которая возвращает случайную строку или int.

Напоследок предлагаю найти другую библиотеку, потому что автор ее уронил. Нет обновлений, ответов и очень мало пользователей.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...