User {{partial}} with a teamplate in nested directory with Ember CLI


#1

Hi,

I use {{partial}} in one template. It refers to another template in a nested directory like templates/directoryA/fileB.hbs.

I try {{partial directoryA.fileB}}, {{partial directoryA/fileB}} and {{partial fileB}} (directoryA is a resource’s name). And none of them work. The errors respectively are

Uncaught Error: Assertion Failed: Unable to find partial with name ‘directory/fileB’.

Uncaught Error: Assertion Failed: templateNames are not allowed to contain periods: _directoryA/directoryB.

Uncaught Error: Assertion Failed: Unable to find partial with name ‘fileB’.

If I refer to a template which is directly below the directory templates, it works.

My question is how to refer to a template that’s in nested directory.


#2

Partials are dasherized in ember-cli.

Using {{partial ‘foo/bar’}} would look for templates/foo/-bar.hbs.


#3

I may still miss something. Even if I change the file name to like -bar.hbs, it’s still not found.

Let me make my previous founding clearer (the error message and what I tried are not clear).

I tried: {{partial “foo/bar”}}

Error: Uncaught Error: Assertion Failed: Unable to find partial with name ‘foo/bar’

I tried: {{partial “foo.bar”}}

Error: Uncaught Error: Assertion Failed: templateNames are not allowed to contain periods: ‘_foo.bar’

I tried: {{partial “bar”}}

Error: Uncaught Error: Assertion Failed: Unable to find partial with name ‘bar’

I don’t know what magic Ember-cli plays here. But it still seems that Ember look for foo/bar for {{partial “foo/bar”}} and it doesn’t find it.


#4

Interestingly, {{partial “foo/bar”}} works. It looks for foo/bar.hbs

I’m not sure why it wasn’t working. Probably it’s because I use camelCase the file name and in {{partial}}. It works when I use all lowercase letters as file name.

Here is naming convention from ember-cli. I haven’t tried to use dashes though.

Dashes file names folder names html tags/ember components CSS classes URLs

camelCase JavaScriptJSON


#5

Using {{partial ‘foo/bar’}} would look for templates/foo/-bar.hbs

Is this still accurate? We went through this with vanilla EmberJS and changed from underscored partial filename (i.e. templates/foo/_bar.hbs) to not having understocres (i.e. templates/foo/bar.hbs). Seems like adding dashes to partial names would be going backwards here.