Merge pull request #10274 from IgniteUI/simeonoff/fix-9975

fix(icon-service): can't register icon w/o family

Author: Konstantin Dinev

projects/igniteui-angular/src/lib/icon/icon.service.ts

@@ -105,7 +105,7 @@ export class IgxIconService {
      *   this.iconService.addSvgIcon('aruba', '/assets/svg/country_flags/aruba.svg', 'svg-flags');
      * ```
      */
-    public addSvgIcon(name: string, url: string, family: string = '') {
+    public addSvgIcon(name: string, url: string, family = this._family) {
         if (name && url) {
             const safeUrl = this._sanitizer.bypassSecurityTrustResourceUrl(url);
             if (!safeUrl) {
@@ -154,8 +154,9 @@ export class IgxIconService {
      * ```
      */
     public isSvgIconCached(name: string, family: string = ''): boolean {
-        if(this._cachedSvgIcons.has(family)) {
-            const familyRegistry = this._cachedSvgIcons.get(family) as Map<string, SafeHtml>;
+        const familyClassName = this.familyClassName(family);
+        if(this._cachedSvgIcons.has(familyClassName)) {
+            const familyRegistry = this._cachedSvgIcons.get(familyClassName) as Map<string, SafeHtml>;
             return familyRegistry.has(name);
         }
 
@@ -169,7 +170,8 @@ export class IgxIconService {
      * ```
      */
     public getSvgIcon(name: string, family: string = '') {
-        return this._cachedSvgIcons.get(family)?.get(name);
+        const familyClassName = this.familyClassName(family);
+        return this._cachedSvgIcons.get(familyClassName)?.get(name);
     }
 
     /**

src/app/icon/icon.sample.html

@@ -86,7 +86,7 @@ <h4 class="sample-title">Using SVG Icons</h4>
             <igx-icon family="svg-flags" name="equals"></igx-icon>
             <igx-icon family="svg-flags" name="is_empty"></igx-icon>
             <igx-icon family="svg-flags" name="starts_with"></igx-icon>
-            <igx-icon family="svg-flags" name="copy"></igx-icon>
+            <igx-icon name="copy"></igx-icon>
         </div>
     </article>
 

src/app/icon/icon.sample.ts

@@ -19,6 +19,6 @@ export class IconSampleComponent implements OnInit {
         this._iconService.addSvgIcon('equals', '/assets/svg/filtering/equals.svg', 'svg-flags');
         this._iconService.addSvgIcon('is_empty', '/assets/svg/filtering/is_empty.svg', 'svg-flags');
         this._iconService.addSvgIcon('starts_with', '/assets/svg/filtering/starts_with.svg', 'svg-flags');
-        this._iconService.addSvgIcon('copy', '/assets/svg/filtering/copy.svg', 'svg-flags');
+        this._iconService.addSvgIcon('copy', '/assets/svg/filtering/copy.svg');
     }
 }