Better know a framework #21: enhance document head with Aurelia

#1

Binding favicon to a view model, demo at https://1rn1866v64.codesandbox.io/

source at https://codesandbox.io/s/1rn1866v64

SO question at https://stackoverflow.com/questions/55175968/switching-favicon-dynamically-in-aurelia-preferably-using-binding/55178896

Basically enhance document.head with a view model:

aureliaInstance.enhance(someViewModel, document.head)

example:

document head:

<link rel="icon" href.bind="iconHref" >

enhancement

aureliaInstance.enhance(
  {
    iconHref: 'https://aurelia.io/media/aurelia-favicon.ico'
  },
  document.head
)
7 Likes

#2

I like it a lot. It’s not super intuitive on its own because it just kinda says “this” and “document.head” but it’s all connected to each other cleanly and super quick which is nice. Guess it can’t be any clearer than that in a way since it’s a view model.

1 Like

#3

Nice example, but best to avoid “magic” in your example solutions, as it causes confusion.
For example <link rel="icon" href.bind="iconHref"> is great, but it’s unclear where iconHref comes from as it’s not a field in the viewmodel and is only declared in a view.
I like seeing views at least pretending to be type-safe in the same way as models :slight_smile:

3 Likes