Template Controllers

Help Requests
1

Hi,

I am looking to implement a feature where a custom element is rendered based on a subscription level. In principle I’d like to be able to declare the subscription level that is required for the element to be rendered in the markup, and then have something else decide if the element should be rendered based on the user’s level.

I thought that a Template Controller would be great for this, as I could have it decide if the template should be rendered based on an internal check to see if the user’s subscripion level is sufficient when compared to the passed in parameter, which declares the required level for the element.

Unfortunately, I can’t get passed an error: “you cannot place a template controller on a surrogate element”. I am placing the template controller on the root template of the custom element. I don’t quite understand what is wrong here?

Is there a more idiomatic way in Aurelia to do this? Ideally I would like to declaratively provide a required subscription level for an element, and then have a thing that is in control of rendering make the decision.

Any help appreciated.

Thanks

2

Hi @quooston! You are on right track with the template controller. You just need to wrap your template with an additional template element.

<!-- root template element -->
<template>
  <!-- template with template controller -->
  <template if-subscribed="subscriptionLevel"> 
  </template>
</template>

With Au2 it is not possible to place a template controller on the root template element.

3

Thanks @Sayan751 for the reply.

I noticed that when I did this, any ref elements were no longer available in my VM. The fact that they are now wrapped in the second level template makes them inaccessible. Do you know how to get around this?

Thanks

4

It should still work. Can you please share a minimal reproduction of this issue?

You can use StackBlitz for this and fork one of the starter project