diff --git a/src/progressbar/progressbar.spec.ts b/src/progressbar/progressbar.spec.ts index 80d7317e53..02412fdfb6 100644 --- a/src/progressbar/progressbar.spec.ts +++ b/src/progressbar/progressbar.spec.ts @@ -58,6 +58,48 @@ describe('ngb-progressbar', () => { expect(progressCmp.getPercentValue()).toBe(20); }); + it('should calculate the percentage (custom max size of null)', () => { + progressCmp.max = null; + + progressCmp.value = 25; + expect(progressCmp.getPercentValue()).toBe(25); + }); + + it('should calculate the percentage (custom max size of undefined)', () => { + progressCmp.max = undefined; + + progressCmp.value = 25; + expect(progressCmp.getPercentValue()).toBe(25); + }); + + it('should calculate the percentage (custom max size of zero)', () => { + progressCmp.max = 0; + + progressCmp.value = 25; + expect(progressCmp.getPercentValue()).toBe(25); + }); + + it('should calculate the percentage (custom negative max size)', () => { + progressCmp.max = -10; + + progressCmp.value = 25; + expect(progressCmp.getPercentValue()).toBe(25); + }); + + it('should calculate the percentage (custom max size of positive infinity)', () => { + progressCmp.max = Number.POSITIVE_INFINITY; + + progressCmp.value = 25; + expect(progressCmp.getPercentValue()).toBe(25); + }); + + it('should calculate the percentage (custom max size of negative infinity)', () => { + progressCmp.max = Number.NEGATIVE_INFINITY; + + progressCmp.value = 25; + expect(progressCmp.getPercentValue()).toBe(25); + }); + it('should set the value to 0 for negative numbers', () => { progressCmp.value = -20; expect(progressCmp.getValue()).toBe(0); diff --git a/src/progressbar/progressbar.ts b/src/progressbar/progressbar.ts index 2142074518..4961b00e72 100644 --- a/src/progressbar/progressbar.ts +++ b/src/progressbar/progressbar.ts @@ -1,5 +1,5 @@ import {Component, Input, ChangeDetectionStrategy} from '@angular/core'; -import {getValueInRange} from '../util/util'; +import {getValueInRange, isNumber} from '../util/util'; import {NgbProgressbarConfig} from './progressbar-config'; /** @@ -19,10 +19,19 @@ import {NgbProgressbarConfig} from './progressbar-config'; ` }) export class NgbProgressbar { + private _max: number; + /** * The maximal value to be displayed in the progress bar. + * + * Should be a positive number. Will default to 100 otherwise. */ - @Input() max: number; + @Input() + set max(max: number) { + this._max = !isNumber(max) || max <= 0 ? 100 : max; + } + + get max(): number { return this._max; } /** * If `true`, the stripes on the progress bar are animated.