圆圈进度不是一个已知的元素:Angular 8

Question

我正在尝试在我的角度项目中使用ng循环进度。在这个项目中，我使用了惰性加载，其中我有两个模块。核心模块和功能模块。核心模块是惰性加载的，在核心模块中，我持有所有必需的组件，在功能模块中，我们持有所有第三方库和管道、指令。

我已经在我的特色模块中导入了NgCircleProgressModule，然后尝试在作为核心模块一部分的组件中使用。角度投掷这个错误-circle progress不是已知元素，如果circle-progress是Angular组件，则验证它是否是该模块的一部分。

插件链接-https://www.npmjs.com/package/ng-circle-progress

这就是我正在使用的方法-

功能模块-

import { NgModule, ModuleWithProviders } from "@angular/core";
import { CommonModule } from '@angular/common';
import { FeaturedRoutingModule } from "@/modules/featured";
import { FeaturedComponent } from "@/modules/featured";
import { NgCircleProgressModule } from 'ng-circle-progress';
import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';
@NgModule({
declarations: [
FeaturedComponent
],
imports: [
CommonModule,
FeaturedRoutingModule,
NgCircleProgressModule.forRoot(),
BsDatepickerModule.forRoot(),
],
exports: [
NgCircleProgressModule,
BsDatepickerModule,
],
})
export class FeaturedModule {
static forRoot(): ModuleWithProviders {
return {
ngModule: FeaturedModule,
providers: [],
};
}
} 

核心模块-

import { NgModule } from "@angular/core";
import { CommonModule } from '@angular/common';
import { CoreRoutingModule } from '@/modules/core';
import { CoreComponent } from '@/modules/core';
import { FeaturedModule } from "@/modules/featured";
import { HomeComponent } from '@core/core-components';
@NgModule({
declarations: [
CoreComponent,
HomeComponent
],
imports: [
CommonModule,
CoreRoutingModule,
FeaturedModule,
],
exports: [
FeaturedModule
]
})
export class CoreModule { }

应用程序模块-

import { FeaturedModule } from "@/Modules/featured";
import { BrowserModule } from "@angular/platform-browser";
import { AppRoutingModule } from "./app-routing.module";
import { HttpClientModule } from "@angular/common/http";
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
import { AppComponent } from "./app.component";
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
BrowserAnimationsModule,
HttpClientModule,
AppRoutingModule,
FeaturedModule.forRoot(),
],
providers: [],
bootstrap: [
AppComponent
],
})

主组件HTML-

<circle-progress
[percent]="85"
[radius]="40"
[outerStrokeWidth]="10"
[innerStrokeWidth]="8"
[outerStrokeColor]="'#78C000'"
[innerStrokeColor]="'#C7E596'"
[animation]="true"
[animationDuration]="300"
></circle-progress>

Answer 1

如果您还没有，您应该安装angular svg progressbar，并将RoundProgressModule添加到@NgModule中的导入中。

npm install angular-svg-round-progressbar --save