crisbeto / angular-svg-round-progressbar

Angular module that uses SVG to create a circular progressbar
https://crisbeto.github.io/angular-svg-round-progressbar/
MIT License
741 stars 173 forks source link

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

Open sunojvijayan opened 6 years ago

sunojvijayan commented 6 years ago

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 -

`

Home

` 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 commented 6 years ago

Getting same error. Any update on this issue?

crisbeto commented 6 years ago

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

stellarpower commented 6 years ago

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 commented 6 years ago

This is covered under the Install section of the readme.

louisdoe commented 5 years ago

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 commented 5 years ago

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

atoyansk commented 4 years ago

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 commented 4 years ago

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