ngx-highlightjs icon indicating copy to clipboard operation
ngx-highlightjs copied to clipboard

Support loading of relative URLs

Open jasomimo opened this issue 2 years ago • 1 comments

Feature Description

When a relative URL is passed into codeFromUrl pipe, then file is not fetched.

<pre>
    <code [highlight]="'/assets/examples/foo.html' | codeFromUrl | async"></code>
</pre>

Let's say user would like to fetch a file from assets folder, but don't want to build full URL (maybe there is too many examples in assets, or they don't know on which domain will be the app deployed to).

If codeFromUrl pipe would support relative paths, it would be possible to reference the file only by a path which is starting from the assets folder. And that path would never change.

HighlightOptions interface might be enriched with baseUrl: string configuration option, where user could set the base path for relative URLs, e.g. https://example.com/my-app.

Use Case

This would allow to more easily reference files deployed on the same domain.

jasomimo avatar May 12 '22 10:05 jasomimo

I would like to have the same feature as well.

Basically if the module provides a way to set URL patterns that can be used in this function, then it should be fine

[code-loader.ts] function isUrl(url: string) { const regExp = /(ftp|http|https)://(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(/|/([\w#!:.?+=&%@!-/]))?/; return regExp.test(url); }

exodussystem avatar Jan 22 '23 13:01 exodussystem

Fixed in v11, you can now use relative path like this

<pre>
    <code [highlight]="'assets/examples/foo.html' | codeFromUrl | async"></code>
</pre>

MurhafSousli avatar Mar 28 '24 04:03 MurhafSousli