fix(badge): adding type for value #8077

Author: kdinev

projects/igniteui-angular/src/lib/badge/badge.component.html

@@ -1,4 +1,4 @@
-<div class="igx-badge__circle" [ngClass]="setClasses()" [attr.aria-roledescription]="roleDescription">
+<div class="igx-badge__circle" [ngClass]="setClasses()">
     <span *ngIf="!icon" class="igx-badge__circle-value">{{value}}</span>
     <igx-icon *ngIf="icon" fontSet="material">{{icon}}</igx-icon>
 </div>

projects/igniteui-angular/src/lib/badge/badge.component.ts

@@ -87,7 +87,7 @@ export class IgxBadgeComponent {
     * ```
     */
     @Input()
-    public value = '';
+    public value: string | number = '';
 
     /**
      * Sets/gets an icon for the badge from the material icons set.
@@ -153,19 +153,15 @@ export class IgxBadgeComponent {
      * @hidden
      * @internal
      */
+    @HostBinding('attr.aria-roledescription')
     get roleDescription() {
-        let message: string;
-
         // tslint:disable-next-line:prefer-conditional-expression
         if (this.icon) {
-            message = this.type + ' type badge with icon type ' + this.icon;
-        } else if (this.value) {
-            message = this.type + ' badge type with value ' + this.value;
-        } else {
-            message = this.type + ' badge type without value';
+            return this.type + ' type badge with icon type ' + this.icon;
+        } else if (this.value || this.value === 0) {
+            return this.type + ' badge type with value ' + this.value;
         }
-
-        return message;
+        return this.type + ' badge type without value';
     }
 
     /**