-
-
Notifications
You must be signed in to change notification settings - Fork 4.7k
Description
Is your feature request related to a problem? Please describe.
Example, I have an object like this:
const items = [{
id: 123,
getter: function getPrimitive()
},
{
id: 456,
getter: function getPrimitive()
}]
I need to render these inside and {#each} block, and execute that item getter.
Describe the solution you'd like
{#each items as rawItem}
{#with rawItem.getter() as item}
This is my {item}
{/with}
{/each}
Describe alternatives you've considered
OPTION 1
I could prerender this in my <script> block and then have a new list of prerenderedItems, but that sort of defeats the purpose. In my example, the getter is meant to do a look up to reduce duplication and overhead in deeply nested objects. Only sometimes might I want to prerender, and sometimes skip:
{#each items as rawItem}
{#if rawItem.id < 200}
{#with rawItem.getter() as item}
This is my {item}
{/with}
{/if}
{/each}
OPTION 2
Another thing I tried (to see if it would work) was to do the variable assignment and evaluation inside a text expression:
<script>
let item
</script>
{#each items as rawItem}
{#if rawItem.id < 200}
{house = rawItem.getter()}
This is my {item}
{/if}
{/each}
This solution seemed to compile, but at runtime:
ReferenceError: $$invalidate is not defined
While this seems like it might be an alternative to my suggestion, it also seems hacky and potentially prone to errors.
OPTION 3
What I have implemented for now is something like the following
>> Parent.svelte
{#each items as rawItem}
{#if rawItem.id < 200}
<Primitive let:item item={rawItem}>
This is my {item}
</Primitive>
{/if}
{/each}
>> Primitive.svelte
<script>
export let item
item = item()
</script>
<slot {item} />
It works and accomplishes what I need, but it seems like a lot of extra work that can be taken care of without having another component.
How important is this feature to you?
Since there is such an ability to add logic directly into the templates, this seems somewhat important. Maybe there is another method to do on the fly evaluation and variable assignment. But I did not see anything in the docs, and I am not aware of another method.