ng-inline-svg - npm Package Compare versions

Comparing version 9.0.1 to 9.1.0

lib/inline-svg.component.d.ts

@@ -7,3 +7,3 @@ import { AfterViewInit, ElementRef, OnChanges, SimpleChanges } from '@angular/core';
     context: InlineSVGDirective;
-    content: Element;
+    content: HTMLElement | SVGElement;
     replaceContents: boolean;
@@ -10,0 +10,0 @@ prepend: boolean;

lib/inline-svg.component.js

@@ -37,3 +37,3 @@ "use strict";
         core_1.Input(),
-        __metadata("design:type", Element)
+        __metadata("design:type", Object)
     ], InlineSVGComponent.prototype, "content", void 0);
@@ -40,0 +40,0 @@ __decorate([

lib/inline-svg.directive.d.ts

@@ -15,2 +15,3 @@ import { ComponentFactoryResolver, ElementRef, EventEmitter, OnChanges, OnDestroy, OnInit, Renderer2, SimpleChanges, ViewContainerRef } from '@angular/core';
     inlineSVG: string;
+    resolveSVGUrl: boolean;
     replaceContents: boolean;
@@ -17,0 +18,0 @@ prepend: boolean;

lib/inline-svg.directive.js

@@ -32,2 +32,3 @@ "use strict";
         this.platformId = platformId;
+        this.resolveSVGUrl = true;
         this.replaceContents = true;
@@ -78,3 +79,3 @@ this.prepend = false;
         this._prevUrl = this.inlineSVG;
-        this._subscription = this._svgCache.getSVG(this.inlineSVG, this.cacheSVG)
+        this._subscription = this._svgCache.getSVG(this.inlineSVG, this.resolveSVGUrl, this.cacheSVG)
             .subscribe(function (svg) {
@@ -150,2 +151,6 @@ if (SvgUtil.isUrlSymbol(_this.inlineSVG)) {
         __metadata("design:type", Boolean)
+    ], InlineSVGDirective.prototype, "resolveSVGUrl", void 0);
+    __decorate([
+        core_1.Input(),
+        __metadata("design:type", Boolean)
     ], InlineSVGDirective.prototype, "replaceContents", void 0);
@@ -152,0 +157,0 @@ __decorate([

lib/inline-svg.directive.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":4,"metadata":{"InlineSVGDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":27,"character":1},"arguments":[{"selector":"[inlineSVG]","providers":[{"__symbolic":"reference","module":"./svg-cache.service","name":"SVGCacheService","line":29,"character":14}]}]}],"members":{"inlineSVG":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"replaceContents":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"prepend":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"injectComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"cacheSVG":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"setSVGAttributes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"removeSVGAttributes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"forceEvalStyles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"evalScripts":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"fallbackImgUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"onSVGLoaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"onSVGInserted":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":44,"character":3}}]}],"onSVGFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":63,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":64,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"PLATFORM_ID","line":64,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":57,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":58,"character":31},{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":59,"character":23},{"__symbolic":"reference","module":"./svg-cache.service","name":"SVGCacheService","line":60,"character":23},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":61,"character":23},{"__symbolic":"reference","module":"./inline-svg.service","name":"InlineSVGService","line":62,"character":31},{"__symbolic":"reference","module":"./inline-svg.config","name":"InlineSVGConfig","line":63,"character":33},{"__symbolic":"reference","name":"Object"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_insertSVG":[{"__symbolic":"method"}],"_processSvg":[{"__symbolic":"method"}],"_insertEl":[{"__symbolic":"method"}],"_fail":[{"__symbolic":"method"}],"_isValidPlatform":[{"__symbolic":"method"}],"_isSSRDisabled":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"InlineSVGDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":27,"character":1},"arguments":[{"selector":"[inlineSVG]","providers":[{"__symbolic":"reference","module":"./svg-cache.service","name":"SVGCacheService","line":29,"character":14}]}]}],"members":{"inlineSVG":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"resolveSVGUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"replaceContents":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"prepend":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"injectComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"cacheSVG":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"setSVGAttributes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"removeSVGAttributes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"forceEvalStyles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"evalScripts":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"fallbackImgUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"onSVGLoaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"onSVGInserted":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":3}}]}],"onSVGFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":46,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":64,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":65,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"PLATFORM_ID","line":65,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":58,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":59,"character":31},{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":60,"character":23},{"__symbolic":"reference","module":"./svg-cache.service","name":"SVGCacheService","line":61,"character":23},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":62,"character":23},{"__symbolic":"reference","module":"./inline-svg.service","name":"InlineSVGService","line":63,"character":31},{"__symbolic":"reference","module":"./inline-svg.config","name":"InlineSVGConfig","line":64,"character":33},{"__symbolic":"reference","name":"Object"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_insertSVG":[{"__symbolic":"method"}],"_processSvg":[{"__symbolic":"method"}],"_insertEl":[{"__symbolic":"method"}],"_fail":[{"__symbolic":"method"}],"_isValidPlatform":[{"__symbolic":"method"}],"_isSSRDisabled":[{"__symbolic":"method"}]}}}}]

lib/inline-svg.service.d.ts

@@ -7,4 +7,4 @@ import { RendererFactory2 } from '@angular/core';
     constructor(rendererFactory: RendererFactory2);
-    insertEl(dir: InlineSVGDirective, parentEl: HTMLElement, content: Element, replaceContents: boolean, prepend: boolean): void;
+    insertEl(dir: InlineSVGDirective, parentEl: HTMLElement, content: HTMLElement | SVGElement, replaceContents: boolean, prepend: boolean): void;
     evalScripts(svg: SVGElement, url: string, evalMode: string): void;
 }

lib/svg-cache.service.d.ts

@@ -0,4 +1,4 @@
+import { PlatformLocation } from '@angular/common';
+import { HttpBackend } from '@angular/common/http';
 import { RendererFactory2 } from '@angular/core';
-import { PlatformLocation } from '@angular/common';
-import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
@@ -10,9 +10,9 @@ import { InlineSVGConfig } from './inline-svg.config';
     private _config;
-    private _http;
     private static _cache;
     private static _inProgressReqs;
     private _baseUrl;
+    private _http;
     private _renderer;
-    constructor(_appBase: string, _location: PlatformLocation, _config: InlineSVGConfig, _http: HttpClient, rendererFactory: RendererFactory2);
-    getSVG(url: string, cache?: boolean): Observable<SVGElement>;
+    constructor(_appBase: string, _location: PlatformLocation, _config: InlineSVGConfig, httpBackend: HttpBackend, rendererFactory: RendererFactory2);
+    getSVG(url: string, resolveSVGUrl: boolean, cache?: boolean): Observable<SVGElement>;
     setBaseUrl(): void;
@@ -19,0 +19,0 @@ getAbsoluteUrl(url: string): string;

lib/svg-cache.service.js

@@ -15,5 +15,5 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var core_1 = require("@angular/core");
 var common_1 = require("@angular/common");
 var http_1 = require("@angular/common/http");
+var core_1 = require("@angular/core");
 var rxjs_1 = require("rxjs");
@@ -27,7 +27,7 @@ var operators_1 = require("rxjs/operators");
 var SVGCacheService = (function () {
-    function SVGCacheService(_appBase, _location, _config, _http, rendererFactory) {
+    function SVGCacheService(_appBase, _location, _config, httpBackend, rendererFactory) {
         this._appBase = _appBase;
         this._location = _location;
         this._config = _config;
-        this._http = _http;
+        this._http = new http_1.HttpClient(httpBackend);
         this._renderer = rendererFactory.createRenderer(null, null);
@@ -43,21 +43,23 @@ this.setBaseUrl();
     SVGCacheService_1 = SVGCacheService;
-    SVGCacheService.prototype.getSVG = function (url, cache) {
+    SVGCacheService.prototype.getSVG = function (url, resolveSVGUrl, cache) {
         var _this = this;
         if (cache === void 0) { cache = true; }
-        var absUrl = this.getAbsoluteUrl(url);
-        if (cache && SVGCacheService_1._cache.has(absUrl)) {
-            return rxjs_1.of(this._cloneSVG(SVGCacheService_1._cache.get(absUrl)));
+        var svgUrl = resolveSVGUrl
+            ? this.getAbsoluteUrl(url)
+            : url;
+        if (cache && SVGCacheService_1._cache.has(svgUrl)) {
+            return rxjs_1.of(this._cloneSVG(SVGCacheService_1._cache.get(svgUrl)));
         }
-        if (SVGCacheService_1._inProgressReqs.has(absUrl)) {
-            return SVGCacheService_1._inProgressReqs.get(absUrl);
+        if (SVGCacheService_1._inProgressReqs.has(svgUrl)) {
+            return SVGCacheService_1._inProgressReqs.get(svgUrl);
         }
-        var req = this._http.get(absUrl, { responseType: 'text' })
+        var req = this._http.get(svgUrl, { responseType: 'text' })
             .pipe(operators_1.finalize(function () {
-            SVGCacheService_1._inProgressReqs.delete(absUrl);
+            SVGCacheService_1._inProgressReqs.delete(svgUrl);
         }), operators_1.share(), operators_1.map(function (svgText) {
             var svgEl = _this._svgElementFromString(svgText);
-            SVGCacheService_1._cache.set(absUrl, svgEl);
+            SVGCacheService_1._cache.set(svgUrl, svgEl);
             return _this._cloneSVG(svgEl);
         }));
-        SVGCacheService_1._inProgressReqs.set(absUrl, req);
+        SVGCacheService_1._inProgressReqs.set(svgUrl, req);
         return req;
@@ -100,3 +102,3 @@ };
     var SVGCacheService_1;
-    SVGCacheService.ngInjectableDef = i0.ɵɵdefineInjectable({ factory: function SVGCacheService_Factory() { return new SVGCacheService(i0.ɵɵinject(i1.APP_BASE_HREF, 8), i0.ɵɵinject(i1.PlatformLocation, 8), i0.ɵɵinject(i2.InlineSVGConfig, 8), i0.ɵɵinject(i3.HttpClient), i0.ɵɵinject(i0.RendererFactory2)); }, token: SVGCacheService, providedIn: "root" });
+    SVGCacheService.ngInjectableDef = i0.ɵɵdefineInjectable({ factory: function SVGCacheService_Factory() { return new SVGCacheService(i0.ɵɵinject(i1.APP_BASE_HREF, 8), i0.ɵɵinject(i1.PlatformLocation, 8), i0.ɵɵinject(i2.InlineSVGConfig, 8), i0.ɵɵinject(i3.HttpBackend), i0.ɵɵinject(i0.RendererFactory2)); }, token: SVGCacheService, providedIn: "root" });
     SVGCacheService = SVGCacheService_1 = __decorate([
@@ -111,3 +113,3 @@ core_1.Injectable({
             inline_svg_config_1.InlineSVGConfig,
-            http_1.HttpClient,
+            http_1.HttpBackend,
             core_1.RendererFactory2])
@@ -114,0 +116,0 @@ ], SVGCacheService);

lib/svg-cache.service.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":4,"metadata":{"SVGCacheService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":8,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":20,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":20,"character":17},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"APP_BASE_HREF","line":20,"character":24}]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":21,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":22,"character":5}}],null,null],"parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","module":"@angular/common","name":"PlatformLocation","line":21,"character":35},{"__symbolic":"reference","module":"./inline-svg.config","name":"InlineSVGConfig","line":22,"character":33},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":23,"character":19},{"__symbolic":"reference","module":"@angular/core","name":"RendererFactory2","line":24,"character":21}]}],"getSVG":[{"__symbolic":"method"}],"setBaseUrl":[{"__symbolic":"method"}],"getAbsoluteUrl":[{"__symbolic":"method"}],"_svgElementFromString":[{"__symbolic":"method"}],"_cloneSVG":[{"__symbolic":"method"}]},"statics":{"_cache":{"__symbolic":"error","message":"Variable not initialized","line":12,"character":17},"_inProgressReqs":{"__symbolic":"error","message":"Variable not initialized","line":13,"character":17},"ngInjectableDef":{}}}}}]
+[{"__symbolic":"module","version":4,"metadata":{"SVGCacheService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":20,"character":5}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":20,"character":17},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"APP_BASE_HREF","line":20,"character":24}]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":21,"character":5}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":22,"character":5}}],null,null],"parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","module":"@angular/common","name":"PlatformLocation","line":21,"character":35},{"__symbolic":"reference","module":"./inline-svg.config","name":"InlineSVGConfig","line":22,"character":33},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpBackend","line":23,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"RendererFactory2","line":24,"character":21}]}],"getSVG":[{"__symbolic":"method"}],"setBaseUrl":[{"__symbolic":"method"}],"getAbsoluteUrl":[{"__symbolic":"method"}],"_svgElementFromString":[{"__symbolic":"method"}],"_cloneSVG":[{"__symbolic":"method"}]},"statics":{"_cache":{"__symbolic":"error","message":"Variable not initialized","line":11,"character":17},"_inProgressReqs":{"__symbolic":"error","message":"Variable not initialized","line":12,"character":17},"ngInjectableDef":{}}}}}]

package.json

 {
   "name": "ng-inline-svg",
-  "version": "9.0.1",
+  "version": "9.1.0",
   "description": "Angular directive for inserting an SVG inline within an element.",
@@ -39,13 +39,13 @@ "repository": {
     "@angular/common": ">=8.0.0",
-    "rxjs": "^6.5.2"
+    "rxjs": "^6.5.0"
   },
   "devDependencies": {
-    "@angular/common": "^8.2.3",
-    "@angular/compiler": "^8.2.3",
-    "@angular/compiler-cli": "^8.2.3",
-    "@angular/core": "^8.2.3",
-    "@angular/platform-browser": "^8.2.3",
+    "@angular/common": "^8.2.9",
+    "@angular/compiler": "^8.2.9",
+    "@angular/compiler-cli": "^8.2.9",
+    "@angular/core": "^8.2.9",
+    "@angular/platform-browser": "^8.2.9",
     "rimraf": "^3.0.0",
-    "rxjs": "^6.5.2",
-    "tslint": "^5.19.0",
+    "rxjs": "^6.5.3",
+    "tslint": "^5.20.0",
     "typescript": "~3.4.0",
@@ -52,0 +52,0 @@ "zone.js": "~0.9.1"

README.md

@@ -67,2 +67,3 @@ # ng-inline-svg
 | cacheSVG | boolean | `true` | Caches the SVG based on the absolute URL. Cache only persists for the (sessional) lifetime of the page. |
+| resolveSVGUrl | boolean | `true` | Bypass logic that tries to determine the absolute URL using the page's or configured base URL. |
 | prepend | boolean | `false` | Inserts before the first child instead of appending, overwrites `replaceContents` |
@@ -69,0 +70,0 @@ | replaceContents | boolean | `true` | Replaces the contents of the element with the SVG instead of just appending it to its children. |

src/inline-svg.component.ts

@@ -21,3 +21,3 @@ import {
   @Input() context: InlineSVGDirective;
-  @Input() content: Element;
+  @Input() content: HTMLElement | SVGElement;
   @Input() replaceContents: boolean;
@@ -24,0 +24,0 @@ @Input() prepend: boolean;

src/inline-svg.directive.ts

@@ -34,2 +34,3 @@ import {
   @Input() inlineSVG: string;
+  @Input() resolveSVGUrl: boolean = true;
   @Input() replaceContents: boolean = true;
@@ -110,3 +111,3 @@ @Input() prepend: boolean = false;
 
-    this._subscription = this._svgCache.getSVG(this.inlineSVG, this.cacheSVG)
+    this._subscription = this._svgCache.getSVG(this.inlineSVG, this.resolveSVGUrl, this.cacheSVG)
       .subscribe(
@@ -170,3 +171,3 @@ (svg: SVGElement) => {
    */
-  private _insertEl(el: Element): void {
+  private _insertEl(el: HTMLElement | SVGElement): void {
     if (this.injectComponent) {
@@ -173,0 +174,0 @@ if (!this._svgComp) {

src/inline-svg.service.ts

@@ -20,3 +20,3 @@ import { Injectable, Renderer2, RendererFactory2 } from '@angular/core';
     parentEl: HTMLElement,
-    content: Element,
+    content: HTMLElement | SVGElement,
     replaceContents: boolean,
@@ -23,0 +23,0 @@ prepend: boolean) {

src/svg-cache.service.ts

@@ -0,7 +1,6 @@
+import { APP_BASE_HREF, PlatformLocation } from '@angular/common';
+import { HttpBackend, HttpClient } from '@angular/common/http';
 import { Inject, Injectable, Optional, Renderer2, RendererFactory2 } from '@angular/core';
-import { APP_BASE_HREF, PlatformLocation } from '@angular/common';
-import { HttpClient } from '@angular/common/http';
 import { Observable, of } from 'rxjs';
-import { map, finalize, share } from 'rxjs/operators';
-
+import { finalize, map, share } from 'rxjs/operators';
 import { InlineSVGConfig } from './inline-svg.config';
@@ -18,2 +17,3 @@
 
+  private _http: HttpClient;
   private _renderer: Renderer2;
@@ -25,4 +25,5 @@
     @Optional() private _config: InlineSVGConfig,
-    private _http: HttpClient,
+    httpBackend: HttpBackend,
     rendererFactory: RendererFactory2) {
+    this._http = new HttpClient(httpBackend);
     this._renderer = rendererFactory.createRenderer(null, null);
@@ -40,20 +41,22 @@
 
-  getSVG(url: string, cache: boolean = true): Observable<SVGElement> {
-    const absUrl = this.getAbsoluteUrl(url);
+  getSVG(url: string, resolveSVGUrl: boolean, cache: boolean = true): Observable<SVGElement> {
+    const svgUrl = resolveSVGUrl
+      ? this.getAbsoluteUrl(url)
+      : url;
 
     // Return cached copy if it exists
-    if (cache && SVGCacheService._cache.has(absUrl)) {
-      return of(this._cloneSVG(SVGCacheService._cache.get(absUrl)));
+    if (cache && SVGCacheService._cache.has(svgUrl)) {
+      return of(this._cloneSVG(SVGCacheService._cache.get(svgUrl)));
     }
 
     // Return existing fetch observable
-    if (SVGCacheService._inProgressReqs.has(absUrl)) {
-      return SVGCacheService._inProgressReqs.get(absUrl);
+    if (SVGCacheService._inProgressReqs.has(svgUrl)) {
+      return SVGCacheService._inProgressReqs.get(svgUrl);
     }
 
     // Otherwise, make the HTTP call to fetch
-    const req = this._http.get(absUrl, { responseType: 'text' })
+    const req = this._http.get(svgUrl, { responseType: 'text' })
       .pipe(
         finalize(() => {
-          SVGCacheService._inProgressReqs.delete(absUrl);
+          SVGCacheService._inProgressReqs.delete(svgUrl);
         }),
@@ -63,3 +66,3 @@ share(),
           const svgEl = this._svgElementFromString(svgText);
-          SVGCacheService._cache.set(absUrl, svgEl);
+          SVGCacheService._cache.set(svgUrl, svgEl);
           return this._cloneSVG(svgEl);
@@ -69,3 +72,3 @@ })
 
-    SVGCacheService._inProgressReqs.set(absUrl, req);
+    SVGCacheService._inProgressReqs.set(svgUrl, req);
 
@@ -72,0 +75,0 @@ return req;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

64052

increased by1.54%

Lines of code

1138

increased by1.16%

Number of lines in readme file

128

increased by0.79%

No dependency changes