1

I'm trying to dynamically add a style sheet to an Angular Element. I'm doing this by adding a to the template. This works fine if I do it through JavaScript. E.g.

newLinkElement.setAttribute('href', '//mystyles.css')

But if I try to do this with a binding:

<link rel="stylesheet" type="text/css" id="backgroundImageStyles" href="{{stylesUrl}}">

I get this error ERROR in HostResourceResolver: could not resolve {{stylesUrl}}. If I just change the attribute I'm binding to then the error goes away. E.g. this works:

<link rel="stylesheet" type="text/css" id="backgroundImageStyles" lang="{{stylesUrl}}">

I've tried [attr.href] and [href] as well with no luck. Does Angular not allow binding to the href attribute of a link?

moefinley
  • 1,248
  • 1
  • 13
  • 26
  • It seems to me you can't implement appending styles to your layout this way. I tried to implement it and this what i got: `HostResourceLoader: loader(StyleFileLink) returned a Promise` I think that's better to control styles via classes then load different files – Mark Minerov Apr 03 '20 at 22:41

0 Answers0