Let block for "the rest of the template"

[mehulkar]

I don't know if this is technically feasible, but it would be nice to put values into scope for the entire template. Something like let block, without having to close the tag. The use case is to instantiate N components.

currently

{{#let (component "foo-bar") as |FooBar|}}
  {{#let (component "baz") as |Baz|}}
    <FooBar />
    <Bar />
  {{/let}}
{{/let}}

after

{{let (component "foo-bar") as |FooBar|}}
{{let (component "baz") as |Baz|}}

<FooBar />
<Bar />

If I understand correctly, each component template has its own scope, so it should be possible to have a syntax that allows you to put something in scope for the whole template. Some of this may also interplay with #454 (template import primitives) as that syntax does something similar.

[kellyselden]

What about

<FooBar />

{{let (component "foo-bar") as |FooBar|}}

or

<div>
  {{let (component "foo-bar") as |FooBar|}}
</div>

<FooBar />

[mehulkar]

I’d be fine with a directive that makes it available in the whole template, as well as something that makes it available below the directive. Whichever makes more sense / easier to achieve. Mostly, I think the nesting lets doesn’t quite convey the intention in my use case, since the lets are meant to be siblings, not parent/child.

[davewasmer]

@mehulkar you might be interested in ember-template-component-import

[mehulkar]

@davewasmer thanks! The implementation of that addon might be helpful! But I'm not specifically looking to put a component in scope (although that is my said use case), I'm wanting to put any let evaluation into scope.

That said, this is purely for DevX, so I would probably never implement it as a custom thing if it wasn't in the framework.

[mmun]

https://github.com/thefrontside/ember-let implements "rest of the block" semantics, e.g.

{{#if person.isActive}}
  <div>
    {{let name=person.name}}
    <span>{{name}}</span>
  </div>
  {{!-- The name binding is not accessible here... --}}
{{/if}}
{{!-- ...or here. -- }}

[rwjblue]

What @mmun said, also we have generally called this form “inline let” (you can see it mentioned in the original let RFC IIRC).

[mehulkar]

Oh awesome, thanks for that those references! (For others looking, here's the link: https://emberjs.github.io/rfcs/0286-block-let-template-helper.html#inline-form).

Going to read through #286 before saying more. It seems like a good amount of discussion has already happened.

[mmun]

I'm still a fan of the feature and encourage you to push on it more :)

[locks]

I think most of the work here would be defining the scope semantics of inline let. Draft it up!

[mehulkar]

Since this is already available as an addon and it's just ergonomics, I'm not too motivated to pursue this. Closing down.

[runspired]

I'd also note that one reason many folks being looking for "inline let" is due to rightward creep when multiple lets are needed. FWIW this can sometimes be solved using block-form let with multiple positional params:

{{#let (component "foo-bar") (component "baz") as |FooBar Baz|}}
  <FooBar />
  <Bar />
{{/let}}

[buschtoens]

Can we potentially reopen this? AFAICT there seems to be general interest and agreement from many. I currently don't have the resources to champion an RFC myself, but I do believe this is still very worthwhile to pursue.

On a meta level: Would it make sense to add a label for such suggestions? "champion-needed" or something?

[mehulkar]

Sure, I can reopen it!