{"id":13535388,"url":"https://github.com/pleerock/ngx-progress-bar","last_synced_at":"2025-04-02T01:30:34.593Z","repository":{"id":65424560,"uuid":"52954443","full_name":"pleerock/ngx-progress-bar","owner":"pleerock","description":"Simple progress bar control for your angular2 applications using bootstrap3.","archived":true,"fork":false,"pushed_at":"2017-04-03T07:57:57.000Z","size":15,"stargazers_count":21,"open_issues_count":1,"forks_count":3,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-05-21T15:18:19.231Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pleerock.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-03-02T10:29:22.000Z","updated_at":"2023-01-28T21:26:42.000Z","dependencies_parsed_at":"2023-01-23T01:55:10.978Z","dependency_job_id":null,"html_url":"https://github.com/pleerock/ngx-progress-bar","commit_stats":null,"previous_names":["pleerock/ng2-progress-bar"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pleerock%2Fngx-progress-bar","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pleerock%2Fngx-progress-bar/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pleerock%2Fngx-progress-bar/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pleerock%2Fngx-progress-bar/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pleerock","download_url":"https://codeload.github.com/pleerock/ngx-progress-bar/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246735362,"owners_count":20825222,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-01T08:00:55.396Z","updated_at":"2025-04-02T01:30:34.156Z","avatar_url":"https://github.com/pleerock.png","language":"TypeScript","funding_links":[],"categories":["Uncategorized","Awesome Angular [![Awesome TipeIO](https://img.shields.io/badge/Awesome%20Angular-@TipeIO-6C6AE7.svg)](https://github.com/gdi2290/awesome-angular) [![Awesome devarchy.com](https://img.shields.io/badge/Awesome%20Angular-@devarchy.com-86BDC1.svg)](https://github.com/brillout/awesome-angular-components)"],"sub_categories":["Uncategorized","Angular \u003ca id=\"angular\"\u003e\u003c/a\u003e"],"readme":"\u003e This repository is for demonstration purposes of how it can be implemented in Angular and is not maintaned. Please fork and maintain your own version of this repository.\r\n\r\n# ngx-progress-bar\r\n\r\nSimple progress bar control for your angular2 applications using bootstrap3. Does not depend of jquery. \r\nIf you don't want to use it without bootstrap - simply create proper css classes. \r\nPlease star a project if you liked it, or create an issue if you have problems with it.\r\n\r\n## Installation\r\n\r\n1. Install npm module:\r\n    \r\n    `npm install ngx-progress-bar --save`\r\n\r\n2. If you are using system.js you may want to add this into `map` and `package` config:\r\n\r\n    ```json\r\n    {\r\n        \"map\": {\r\n            \"ngx-progress-bar\": \"node_modules/ngx-progress-bar\"\r\n        },\r\n        \"packages\": {\r\n            \"ngx-progress-bar\": { \"main\": \"index.js\", \"defaultExtension\": \"js\" }\r\n        }\r\n    }\r\n    ```\r\n## Usage\r\n\r\n```typescript\r\n\u003cprogress-bar [value]=\"50\" [max]=\"100\" title=\"Text to be put in the progress bar\"\u003e\u003c/progress-bar\u003e\r\n```\r\n\r\n* `value` is a progress number\r\n* `max` is a maximal number of the progress. By default is 100.\r\n* `title` is a text that will be shown in the progress bar. This is optional.\r\n\r\n## Sample\r\n\r\n```typescript\r\nimport {Component} from \"@angular/core\";\r\nimport {ProgressBarModule} from \"ngx-progress-bar\";\r\n\r\n@Component({\r\n    selector: \"app\",\r\n    template: `\r\n    \u003cdiv class=\"container\"\u003e\r\n        \u003cprogress-bar [value]=\"50\" [max]=\"100\"\u003e\u003c/progress-bar\u003e\r\n    \u003c/div\u003e\r\n    `\r\n})\r\nexport class App {\r\n\r\n}\r\n\r\n@NgModule({\r\n    imports: [\r\n        // ...\r\n        ProgressBarModule\r\n    ],\r\n    declarations: [\r\n        App\r\n    ],\r\n    bootstrap: [\r\n        App\r\n    ]\r\n})\r\nexport class AppModule {\r\n\r\n}\r\n```\r\n\r\nTake a look on samples in [./sample](https://github.com/pleerock/ngx-progress-bar/tree/master/sample) for more examples of\r\nusages.\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpleerock%2Fngx-progress-bar","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpleerock%2Fngx-progress-bar","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpleerock%2Fngx-progress-bar/lists"}