angular - 如何在ionic 3中设计圆形进度条？

Question

如何在 ionic 3 中创建循环进度条。我是 ionic 的新手。 我已经尝试安装了

npm install jquery-circle-progress

package link here

它安装完美，但我很困惑如何在 ionic 中使用它？ 请指导我。提前致谢

更新:

 import { NgModule } from '@angular/core';
 import { IonicPageModule } from 'ionic-angular';
 import { ProfilePage } from './profile';
 import { RoundProgressComponent } from 'angular-svg-round-progressbar'; 

       @NgModule({ 
           declarations: [ ProfilePage, ],
           imports: [IonicPageModule.forChild(ProfilePage), ], }) 

           export class ProfilePageModule {}

Answer 1

更新:2017 年 6 月 11 日

这不适用于最新版本 (1.2.0)。但它与 npm install angular-svg-round-progressbar@1.1.1 --save 一起工作正常。

Working git repo :

另一个Answer is here

旧答案:

你不能在 Ionic 中使用上面提到的 jquery 进度条。你必须为此使用 Angular 模块。

这是您可以使用的。

Demo

Git Repo

步骤:

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

之后您需要在您的模块中导入RoundProgressModule，如下所示:

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

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

更新:

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

       @NgModule({ 
           declarations: [ ProfilePage, ],
           imports: [IonicPageModule.forChild(ProfilePage),
                     RoundProgressModule],
           }) 

           export class ProfilePageModule {}