Can't bind to 'current' since it isn't a known property of 'round-progress'

[sunojvijayan]

Hi I am trying to implement this in my app(Ionic 3) but it gives this error.

Error: Template parse errors: Can't bind to 'current' since it isn't a known property of 'round-progress'.

1. If 'round-progress' is an Angular component and it has 'current' input, then verify that it is part of this module.
2. If 'round-progress' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component

My code is home.ts -

import { NgModule } from '@angular/core'; import { RoundProgressModule, RoundProgressConfig } from 'angular-svg-round-progressbar'; @IonicPage() @Component({ selector: 'page-ownerhome', templateUrl: 'ownerhome.html', }) @NgModule({ imports: [RoundProgressModule] }) export class OwnerhomePage { current: any; max: any;

home.html -

<ion-header> <ion-navbar color="danger"> <ion-title>Home</ion-title> </ion-navbar> </ion-header> <ion-content padding> <ion-item> <round-progress [current]="current" [max]="max"></round-progress> </ion-item> </ion-content>

inside package.json -

"angular-svg-round-progressbar": "^1.2.1",

app.module.ts - import { RoundProgressModule } from 'angular-svg-round-progressbar'; imports: [ BrowserModule, RoundProgressModule, IonicModule.forRoot(MyApp) ],

[saqibmian]

Getting same error. Any update on this issue?

[crisbeto]

That error means that you haven't included the RoundProgressModule in your NgModule.

[stellarpower]

It needs to be added to the @NgModule declaration in app.module.ts to function correctly. Perhaps this could be expanded on in the docs.

[crisbeto]

This is covered under the Install section of the readme.

[louisdoe]

Hey I have this error too. I am sure I have included RoundProgressModule in my NgModule as you can see below.

I did yarn add angular-svg-round-progressbar --save.

and in my app.module.ts:

...
import {RoundProgressModule} from 'angular-svg-round-progressbar';


@NgModule({
    declarations: [
        MyApp,
        HomePage,
       ...

    ],
    imports: [
        BrowserModule,
        IonicModule.forRoot(MyApp),
        AngularFireModule.initializeApp(firebaseConfig.fire),
        NgxErrorsModule,
        AngularFireDatabaseModule,
        AngularFireStorageModule,
        AngularFirestoreModule,
        HttpClientModule,
        ChartsModule,
        RoundProgressModule,
...

Any idea what's happening? The issue is not always here, sometimes, the app loads and I see the round progress bars...

[tmdevde]

You have to import the module in your page.module.ts too ;-)

[atoyansk]

Same error here. I've import the module in app.module.ts, home.module.ts and also I tried to import in home.ts, but still not working.

[kryptonn]

Same error here. I've import the module in app.module.ts, home.module.ts and also I tried to import in home.ts, but still not working.

As tmdevde said, you need to import in home.module.ts, not home.ts