angular - 得到“错误 TS2304:找不到名称 'id'。” 当试图测试“ngx-diagram”示例时
问题描述
我正在尝试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();
}
}
解决方案
使用库的非常奇怪的示例(在库 github 页面上)。我认为 id() 是生成随机字符串并返回它的函数,但是 ngx-charts 的作者没有提到它。尝试替换id()
为this.id()
. 然后创建返回一些随机字符串或整数的函数。
最后,我建议找到其他库,因为作者放弃了它。没有更新,没有答案,用户也很少。
推荐阅读
- android - 我需要在哪里选择要在 RecylerView 中显示的?
- c++ - 有没有可以缩短此代码的语法?
- html - AngularJS - 单击按钮后关注文本框
- r - 在 R 中使用 grep() 匹配字符串中所有模式的方法是什么?
- python - 带有 pandas 的自定义函数分配以在字典中获取匹配项
- mysql - 如何在 MySQL 中选择具有多个 AND/OR 语句的行?
- python - getPerspectiveTransform 断言错误 openCV
- java - 如何在春季批处理中使用 HibernateCursorItemReader
- angular - 如何从 Mat 行获取 Mat 字段
- html - CSS html * 除了某些类?