fix(temperature-dragger): update getUrlPath to return fragment instead of path

motivation: fix clip path and blur filter failing to render under useHash: true routing option

close issue #5758
This commit is contained in:
Raynald Mirville 2020-12-07 14:14:44 -05:00
parent 98166c5274
commit 6074d5ccfb
2 changed files with 4 additions and 7 deletions

View file

@ -19,8 +19,8 @@
</defs>
<g [attr.transform]="styles.arcTranslateStr">
<g class="toClip" [attr.clip-path]="getUrlPath('#sliderClip')">
<g class="toFilter" [attr.filter]="getUrlPath('#blurFilter')">
<g class="toClip" [attr.clip-path]="getUrlFragment('#sliderClip')">
<g class="toFilter" [attr.filter]="getUrlFragment('#blurFilter')">
<path [attr.d]="arc.d" [attr.fill]="off ? styles.nonSelectedArc.color : arc.color" *ngFor="let arc of styles.gradArcs"></path>
</g>
<!-- ngFor is a quirk fix for webkit rendering issues -->

View file

@ -129,11 +129,8 @@ export class TemperatureDraggerComponent implements AfterViewInit, OnChanges {
this.invalidatePinPosition();
}
getUrlPath(id: string) {
const baseHref = this.locationStrategy.getBaseHref().replace(/\/$/, '');
const path = this.location.path().replace(/\/$/, '');
return `url(${baseHref}${path}${id}${this.svgControlId})`;
getUrlFragment(id: string) {
return `url(${id}${this.svgControlId})`;
}
private invalidate(): void {