Usage

Assemble the avatar directives in your template.
<div ngpProgress [ngpProgressValue]="percentage">
  <div ngpProgressIndicator [style.width.%]="percentage"></div>
</div>

API Reference

The following directives are available to import from the @ng-primitives/ng-primitives/progress package:

NgpProgressDirective

ngpProgressValue
number
Define the progress value.
ngpProgressMax
number
default:"100"
Define the progress max value.
ngpProgressValueLabel
(value: number, max: number) => string
Define a function that returns the progress value label.

NgpProgressIndicatorDirective

There are no inputs or outputs for this directive.

Schematics

You can use our schematic to generate a new progress component.
ng generate @ng-primitives/ng-primitives:progress

Options

name
string
The name of the component.
project
string
The name of the project to add the component to.
path
string
The path to create the component.