How to use route as a judgement?
just that for example:
if current route is index.signup so this code {{#link-to 'index.signup'}}signup{{/link-to}} will action.
{{#if routeNameisSomething}}
{{#link-to 'index.signup'}}signup{{/link-to}}
{{else}}
{{#link-to 'index.login'}}login{{/link-to}}
{{/if}}
Related
I am using Ember.js version 2.8.2.
I want to wrap things inside link-to only if condition is true.
First try:
{{#if isAdmin}}
{{#link-to admin}}
contents here
{{/link-to}}
{{else}}
contents here
{{/if}}
Problem: the code is not dry, because content repeats twice.
How should I do this? Thanks.
First option:
If you want to remove it from your dom, wrap your "link-to" component as a component (my-admin-link.hbs):
{{#if isAdmin}}
{{#link-to admin}}
{{yield}}
{{/link-to}}
{{else}}
{{yield}}
{{/if}}
Than use it as:
{{#my-admin-link}}
your content
{{/my-admin-link}}
Second option:
Use disabled and disabledClass of link-to:
{{#link-to admin disabled=isNotAdmin disabledClass='showastext'}}
your content
{{/link-to}}
In your app.css showastext can be defined as:
.showastext{
text-decoration: none;
cursor: text;
color: black;
}
I have an each loop that looks something like this:
{{#each controller}}
{{#link-to 'searches.show' this}}
<span>{{name}}</span>
{{/link-to}}
{{/each}}
At the moment, the this in {{#link-to 'searches.show' this}} seems to refer to the content of the controller, rather than to the controller itself. Is there a way to pass in the controller here, rather than its model?
{{#each}}
{{#link-to 'searches.show' controller}}
<span>{{name}}</span>
{{/link-to}}
{{/each}}
This will work fine.
When i use {{each}} for example:
{{#each imagepost}}
<li>{{title}}</li>
{{else}}
empty :O
{{/each}}
I get the 'empty :O' message
When i do it like this:
{{#each imagepost in controller}}
<li>{{imagepost.title}}</li>
{{else}}
empty :O
{{/each}}
It works fine!
It is weird cause the docs says to do it like this:
{{#each people}}
<li>Hello, {{name}}!</li>
{{/each}}
Which doesnt work for me =/
Does the shortened version won't apply to models? only to controller's properties?
the shortened version only applies to properties on the controller/model or the controller/model. In your case it would be:
{{#each controller}}
<li>{{title}}</li>
{{else}}
empty :O
{{/each}}
or
{{#each model}}
<li>{{title}}</li>
{{else}}
empty :O
{{/each}}
Note, if you do {{#each model}} and you have an itemController defined on the array controller it won't wrap each item with the item controller, you would need to do this: {{#each model itemController='foo'}}.
I'm having a scoping issue with Handlebars templates. I have a list of modules, each of which contains a list of services. So I have a template like this (with some markup removed):
{{#each controller}}
<a onclick='$(".{{unbound uuid}}").toggle(0);'>
{{#each service in services}}
<div class='{{unbound uuid}}'></div>
{{/each}}
{{/each}}
The problem is that the second {{unbound uuid}} doesn't get substituted. And if I try accessing any other item of the outer scope, the same thing happens. However, the Ember.js site says that using the each ... in helper should preserve outer scope. What am I doing wrong?
(FYI: Using latest version of Ember.js, Ember-data and Handlebars.)
Maybe this is the right syntax?
{{#each item in controller}}
<a onclick='$(".{{unbound item.uuid}}").toggle(0);'>
{{#each service in services}}
<div class='{{unbound item.uuid}}'></div>
{{/each}}
{{/each}}
I'm trying to analyse TodoMVC's Ember example. What does the second argument to the #each helper mean?
<ul id="todo-list">
{{#each filteredTodos itemController="todo"}}
<li {{bindAttr class="isCompleted:completed isEditing:editing"}}>
{{#if isEditing}}
{{view Todos.EditTodoView todoBinding="this"}}
{{else}}
{{view Ember.Checkbox checkedBinding="isCompleted" class="toggle"}}
<label {{action "editTodo" on="doubleClick"}}>{{title}}</label>
<button {{action "removeTodo"}} class="destroy"></button>
{{/if}}
</li>
{{/each}}
</ul>
It's supposed to be an option hash but I'm not sure.
It sets the itemController property of the current controller (TodosController I presume) to todo i.e the instance of the TodoController.
That means that every item (<li> element) will be binded not to the TodosController but to a TodoController instance.
isEditing looks for the property on the instance of TodoController and {{ action "removeTodo" }} will call removeTodo function on TodoController.