java项目怎么使用js插件_如何在angular 6项目中使用svg.js和插件

我使用angular-cli创建了一个Angular 6项目 . 我安装了svg.js以及svg.drggable.js . 我还添加了一个名为“draw”的新组件 .

我想用svg.js制作一个简单的矩形 . 为了在Javascript中这样做，HTML文件需要具有属性的div元素，例如“画画” . 但是，当我在组件html文件中放入div元素时，不会创建矩形 . 在app-component中添加div-element可以解决这个问题 .

我不确定它是否与dom-element的hierar有关 . 但如果是这样，甚至可以将svg.js与新组件一起使用？

这就是draw.component.html的样子：

draw.component.ts

import { Component, OnInit } from '@angular/core';

import * as SVG from 'svg.js';

import * as drag from 'svg.draggable.js';

@Component({

selector: 'app-draw',

templateUrl: './draw.component.html',

styleUrls: ['./draw.component.css']

})

export class DrawComponent implements OnInit {

rect = SVG("drawing").size(500,500).rect(300,30).fill('FFBbAA').move(20,20)

constructor() { }

ngOnInit() {

}

}

app.component.ts