I have an array of strings passed as an argument to a component, inside the component I am using "each" helper to render each string in a text input. I tried the following approach.
I have a model passed as an argument to a component. I'm using #each helper to iterate through that model and this does not work.
Example:
<div>
<Location::LocationList @model="{{@model}}"/>
</div>
<ul class="location-list">
{{#each this.args.model as |location|}}
<li>
{{@location.title}}
</li>
{{/each}}
</ul>
And if I just do it in this way:
<ul class="location-list">
{{#each @model as |location|}}
<li>
<Location::LocationItem @location={{location}}/>
</li>
{{/each}}
</ul>
It works as needed. Any suggestions?
According to the docs on Component Arguments , using the @model
as you have in your last snippet,
<ul class="location-list">
{{#each @model as |location|}}
<li>
<Location::LocationItem @location={{location}}/>
</li>
{{/each}}
</ul>
is the correct way to reference arguments.
Referencing args via this.args
is reserved for usage in the class body of a component.
the @namedArgs
syntax is consistent across class-based components and template-only components as template-only components do not have a this
.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.