You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
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.
The text was updated successfully, but these errors were encountered:
I'd be wary of using a name like with because it sounds like with statements, which are decidedly not something we want to implement, as they make things impossible to statically analyze.
Is your feature request related to a problem? Please describe.
Example, I have an object like this:
I need to render these inside and
{#each}
block, and execute thatitem
getter.Describe the solution you'd like
Describe alternatives you've considered
OPTION 1
I could prerender this in my
<script>
block and then have a new list ofprerenderedItems
, but that sort of defeats the purpose. In my example, thegetter
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:OPTION 2
Another thing I tried (to see if it would work) was to do the variable assignment and evaluation inside a text expression:
This solution seemed to compile, but at runtime:
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
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.
The text was updated successfully, but these errors were encountered: