animationDuration

<igx-linear-bar [animationDuration]="3000"></igx-linear-bar>
<igx-circular-bar [animationDuration]="3000"></igx-linear-bar>
Copy

progressChanged

public progressChange(event) {
    alert("Progress made!");
}
 //...
Copy

<igx-circular-bar (progressChanged)="progressChange($event)"></igx-circular-bar>
<igx-linear-bar (progressChanged)="progressChange($event)"></igx-linear-bar>
Copy

animate

• get animate(): boolean

• progress bar にアニメーションがあるかどうかを true/false として返します。

  @ViewChild("MyProgressBar")
  public progressBar: IgxLinearProgressBarComponent | IgxCircularBarComponent;
  public animationStatus(event) {
      let animationStatus = this.progressBar.animate;
      alert(animationStatus);
  }
  Copy

  返却 boolean

• set animate(animate: boolean): void

• 進行状況をアニメーション化します。デフォルトで true に設定されます。

  <igx-linear-bar [animate]="false"></igx-linear-bar>
  <igx-circular-bar [animate]="false"></igx-circular-bar>
  Copy

  パラメーター

  • animate: boolean

  返却 void

indeterminate

• get indeterminate(): boolean

• プログレス バーの現在の状態を取得します:

  • 不確定な状態 (プログレスの値が表示されない) の場合は true 、
  • プログレス バーに実際の進行状況が表示される場合は false 。

  const isIndeterminate = progressBar.indeterminate;
  Copy

  返却 boolean

• set indeterminate(isIndeterminate: boolean): void

• プログレス バーを不確定に設定します。デフォルトの設定は false です。

  <igx-linear-bar [indeterminate]="true"></igx-linear-bar>
  <igx-circular-bar [indeterminate]="true"></igx-circular-bar>
  Copy

  パラメーター

  • isIndeterminate: boolean

  返却 void

max

• get max(): number

• progress bar の最大進行値を返します。

  @ViewChild("MyProgressBar")
  public progressBar: IgxLinearProgressBarComponent | IgxCircularBarComponent;
  public maxValue(event) {
      let max = this.progressBar.max;
      alert(max);
  }
  Copy

  返却 number

• set max(maxNum: number): void

• 渡すことができる最大値を設定します。デフォルトで 100 に設定されます。

  <igx-linear-bar [max]="200"></igx-linear-bar>
  <igx-circular-bar [max]="200"></igx-circular-bar>
  Copy

  パラメーター

  • maxNum: number

  返却 void

step

• get step(): number

• progress bar の進行状況インジケーターを更新する値を返します。

  @ViewChild("MyProgressBar")
  public progressBar: IgxLinearProgressBarComponent | IgxCircularBarComponent;
  public stepValue(event) {
      let step = this.progressBar.step;
      alert(step);
  }
  Copy

  返却 number

• set step(val: number): void

• 進行状況インジケーターの更新量の値を設定します。これはデフォルトでは 1 です。

  <igx-linear-bar [step]="1"></igx-linear-bar>
  <igx-circular-bar [step]="1"></igx-circular-bar>
  Copy

  パラメーター

  • val: number

  返却 void

text

• get text(): string

• カスタム テキストを取得します。

  let text = this.circularBar.text;
  Copy

  返却 string

• set text(value: string): void

• カスタムテキストを設定します。これにより、カウンター値が非表示になります。

  <igx-circular-bar text="my text"></igx-circular-bar>
  Copy

  パラメーター

  • value: string

  返却 void

value

• get value(): number

• 現在の IgxLinearProgressBarComponent/IgxCircularProgressBarComponent 位置を示す値を返します。

  @ViewChild("MyProgressBar")
  public progressBar: IgxLinearProgressBarComponent / IgxCircularProgressBarComponent;
  public getValue(event) {
      let value = this.progressBar.value;
      alert(value);
  }
  Copy

  返却 number

• set value(val: number): void

• 現在の IgxLinearProgressBarComponent / IgxCircularProgressBarComponent 位置を示す値を設定します。

  <igx-linear-bar [value]="50"></igx-linear-bar>
  <igx-circular-bar [value]="50"></igx-circular-bar>
  Copy

  パラメーター

  • val: number

  返却 void

valueInPercent

• get valueInPercent(): number

• IgxLinearProgressBarComponent/IgxCircularProgressBarComponent 値をパーセンテージとして返します。

  @ViewChild("MyProgressBar")
  public progressBar: IgxLinearProgressBarComponent / IgxCircularProgressBarComponent
  public valuePercent(event){
      let percentValue = this.progressBar.valueInPercent;
      alert(percentValue);
  }
  Copy

  返却 number