Angular SVG round progressbar not work for Ionic

|▌冷眼眸甩不掉的悲伤 提交于 2019-12-07 00:07:15

问题


Im read and install this Angular SVG round progressbar for my ionic project , but its not working for me,
https://github.com/crisbeto/angular-svg-round-progressbar

how to correctly added for this my page? please help me to fix this displayed 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

to suppress this message. 3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("

  <round-progress [ERROR ->][current]="48" [max]="100"></round-progress>
</ion-content>

")

Thanks

my pages for im added home.html

<round-progress
    [current]="current"
    [max]="max"
    [color]="'#45ccce'"
    [background]="'#eaeaea'"
    [radius]="125"
    [stroke]="20"
    [semicircle]="true"
    [rounded]="true"
    [clockwise]="false"
    [responsive]="false"
    [duration]="800"
    [animation]="'easeInOutQuart'"
    [animationDelay]="0"
    (onRender)="doSomethingWithCurrentValue($event)"></round-progress>

home.ts

import { Component,NgModule } from '@angular/core';
import {RoundProgressModule} from 'angular-svg-round-progressbar';
import { NavController } from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html',


})
@NgModule({
  imports: [RoundProgressModule]
})
export class HomePage {

  constructor(public navCtrl: NavController,private _config: RoundProgressConfig) {
 _config.setDefaults({
  color: '#f00',
  background: '#0f0'
});
  }

}

回答1:


Update: You need to use an older version as shown below.The current version has an issue where I have mentioned below.

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

Working Git Repo is here

You just need to add it to your page's module as shown below.

home.module.ts

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

@NgModule({
  declarations: [
    HomePage,
  ],
  imports: [
    IonicPageModule.forChild(HomePage),
    RoundProgressModule
  ],
})
export class HomePageModule { }

Note:

It seems to have a new issue with this module.I have logged it. We have to wait till they'll give the solution.Git issue is here.




回答2:


Try to add schema in module component and check

    @NgModule({
      imports: [RoundProgressModule],
schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
    })


来源:https://stackoverflow.com/questions/47067969/angular-svg-round-progressbar-not-work-for-ionic

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!