ColorsComponent

Copy Codeimport { Component } from '@angular/core';

@Component({
    selector: 'my-app',
    template: `
        <kendo-arcgauge [value]="value">
             <kendo-arcgauge-colors>
                 <kendo-arcgauge-color *ngFor="let item of colors"
                     [from]="item.from" [to]="item.to" [color]="item.color">
                 </kendo-arcgauge-color>
             </kendo-arcgauge-colors>
        </kendo-arcgauge>
    `
})
export class AppComponent {
    public value: number = 10;

    public colors: any[] = [{
        to: 25,
        color: '#0058e9'
    }, {
        from: 25,
        to: 50,
        color: '#37b400'
    }, {
        from: 50,
        to: 75,
        color: '#ffc000'
    }, {
        from: 75,
        color: '#f31700'
    }];
}