indeterminate 属性の値を設定する @Input プロパティ。指定しない場合は、自動的に false に設定されます。
<igx-circular-bar [indeterminate]="true"></igx-circular-bar>
進行状況が変更された後にトリガーするイベント。
public progressChange(event) {
alert("Progress made!");
}
//...
<igx-circular-bar [value]="currentValue" (onProgressChanged)="progressChange($event)"></igx-circular-bar>
igxCircularBar に表示するテキストを取得または設定します。
<igx-circular-bar text="Progress"></igx-circular-bar>
let text = this.circularBar.text;
テキストの表示状態を設定します。デフォルトで true に設定されます。
<igx-circular-bar [textVisibility]="false"></igx-circular-bar>
IgxCircularProgressBarComponent にアニメーションがあるかどうかを true/false として返します。
@ViewChild("MyProgressBar")
public progressBar: IgxCircularProgressBarComponent;
public animationStatus(event) {
let animationStatus = this.progressBar.animate;
alert(animationStatus);
}
IgxCircularProgressBarComponent に進行状況でアニメーションを再生します。デフォルトで true に設定されます。
<igx-circular-bar [animate]="false" [value]="50"></igx-circular-bar>
IgxCircularProgressBarComponent の最大進行状況値を返します。
@ViewChild("MyProgressBar")
public progressBar: IgxCircularProgressBarComponent;
public maxValue(event) {
let max = this.progressBar.max;
alert(max);
}
<igx-circular-bar [max]="245" [animate]="false" [value]="currentValue"></igx-circular-bar>
渡すことができる最大値を設定します。デフォルトで 100 に設定されます。
<igx-circular-bar [max]="200" [value]="0"></igx-circular-bar>
IgxCircularProgressBarComponent の進行状況インジケーターを更新する値を返します。
@ViewChild("MyProgressBar")
public progressBar: IgxCircularProgressBarComponent;
public stepValue(event) {
let step = this.progressBar.step;
alert(step);
}
進行状況インジケーターの更新量の値を設定します。デフォルト値は最大値の 1% です。
<igx-circular-bar [striped]="false" [max]="200" [value]="0" [step]="1"></igx-circular-bar>
現在の IgxCircularProgressBarComponent 位置を示す値を返します。
@ViewChild("MyProgressBar")
public progressBar: IgxCircularProgressBarComponent;
public getValue(event) {
let value = this.progressBar.value;
alert(value);
}
<button igxButton="fab" igxRipple="" (click)="getValue()">Click</button>
現在の IgxCircularProgressBarComponent 位置を示す値を設定します。
<igx-circular-bar [value]="50"></igx-circular-bar>
IgxLinearProgressBarComponent/IgxCircularProgressBarComponent 値をパーセンテージで返します。
@ViewChild("MyProgressBar")
public progressBar: IgxLinearProgressBarComponent; // IgxCircularProgressBarComponent
public valuePercent(event){
let percentValue = this.progressBar.valueInPercent;
alert(percentValue);
}
IgxLinearProgressBarComponent/IgxCircularProgressBarComponent 値をパーセンテージで設定します。
@ViewChild("MyProgressBar")
public progressBar: IgxLinearProgressBarComponent; // IgxCircularProgressBarComponent
public setValue(event){
this.progressBar.valueInPercent = 56;
}
//...
<button igxButton="fab" igxRipple="" (click)="setValue()">setValue</button>
id属性の値を設定する @Input プロパティ。提供されていない場合、自動的に生成されます。<igx-circular-bar [id]="'igx-circular-bar-55'" [value]="50"></igx-circular-bar>