is there a way to specify the controller for {{render}}? - ember.js

The reason I want to do this is that I have a list of objects that should be displayed twice, once in expanded form and once in compact form. So I would like to do this:
{{render 'widgets' store.widgets}}
...
{{render 'widgets-compact' store.widgets}}
and in both cases use the WidgetsController.

Ah I realized after looking at the code that although it is not mentioned anywhere in the documentation, you can just do controller=
{{render 'widgets-compact' store.widgets controller=widgets}}

Related

emberJs giving different routes to links

I got a page that includes 15 pictures and I must redirect user to the details page if one of them is clicked. so, I have 15 different routes like 1,2,3,...15. But as I know, I cant give dynamic variable to #link-to helper. So how am I gonna make every picture go to its own route? this is how my index page .hbs looks like :
{{#each model as |rentalUnit|}}
{{rental-listing rental=rentalUnit}}
{{/each}}
{{outlet}}
This is how I print every picture. And this is how am I trying to go to routes :
{{#link-to "???"}}<img src={{rental.image}} width="200">{{/link-to}}
so, there is ??? because I dont know what to do. Thanks!
Well, first why not use a dynamic segment in your route? Like this:
this.route('image', {path: '/images/:id'});
But what you want can be done by just passing a variable, not a string to the link to helper as first argument:
{{#link-to target}}
Where {{target}} would print your route name. So target is a variable here, not a string.
Checkout this twiddle.

"where" clause in template helper

First of all Hello to all,
I am new to Meteor and just a hobby developper. Something I am sure pretty simple has been bugging me for the last days and I will try to explain my issue through a simple example.
Lets consider an online forum where I have Categories of Forums and in each of them one of more forums.
I would like the final result in my template to be something like:
{{#each category}}
{{#each forum where forum.category=category}}
{{nameForum}}
{{/each}}
{{each}}
and that would list the category and for each of them the different forum inside of it.
My questions are:
would be what's the best approach for such a problem ? meaning:
Shall forums be a sub-elements of the categories in the Schema but then the shcema seems a bit complicated.
Shall forum and categories be separated schema but in the same collection but then how can I do this "where" in the template ?
Do I have a totally silly approach on the issue and I missed something in the tutorial ?
Thank you in advance for your reply.
Ivo
Do something like this
myTemplate.html
{{#each getCategories}}
{{#each getForum categoryName}} // Assuming that in your category db you have categoryName field
{{nameForum}}
{{/each}}
{{each}}
myTemplate.js
Template.myTemplate.helpers({
getCategories: function() {
return Category.find({});
},
getForum: function(category) {
return Forum.find({"category": category});
}
})
Basically you move the logic of retrieving the forum inside your template helper

ember/handlebars template using dynamic string as variable name

I have a weird situation where I need to use a dynamic string as a variable name in a handlebars loop in my Ember application.
I have a table with some coffee drinks. Let's say I have a couple variables in my controller called "customDrinksList", "customDrink1", and "customDrink2".
customDrinksList is an array with strings ["customDrink1", "customDrink2"].
customDrink1 and customDrink2 are arrays of drink objects that come from my ember-data store.
{{#each customDrink in customDrinksList}}
<tr>
<td>{{customDrink}}</td>
{{#each drink in customDrink}}
...
{{/each}}
</tr>
{{/each}}
When I do this, customDrink is just the string but in the {{#each drink in customDrink}} statement I want to use the variable with that string name instead of using the actual string.
When I substitute in the variable name (such as customDrink1) it returns the drinks as I'm looking for, but I need to have the variable names in customDrinksList be looped through.
Not sure if this is possible since I haven't been able to find any solutions or maybe I should be taking another approach. Any suggestions welcome.
This project is using Ember 1.13.x
You can't do this from within the template. Consider adding a computed property in the controller/component etc.:
customDrinksListValues: Ember.computed.map(
'customDrinksList',
function(drink) { return this.get(drink); })

How to render a component based on model parameter

I have the requirement to render a template based on a property of my model.
My stratergy was to use custom if block helpers for the handle bars templates, something like this:
{{#ifequals type 'cars'}}
{{cars-component}}
{{/ifequals}}
{{#ifequals type 'planes'}}
{{planes-component}}
{{/ifequals}
but I cant create a block helper that resolves parameter passed by the template to the helper.
if I use Handlebars.registerHandlebars, it resolves the variable name insted of the variable.
the reason i need to do this is because it is part of a plugin framework.
Option blocks (special if statements) don't work properly in ember handlebars helpers. https://github.com/emberjs/ember.js/issues/2237
isCar: Ember.computed.equals('type', 'cars')
isPlane: Ember.computed.equals('type', 'planes')
{{#if isCar}}
{{cars-component}}
{{/if}}
{{#if isPlan}}
{{planes-component}}
{{/if}}
It almost looks like you can do it, but there is a problem with it, as is pointed out in the github issue above.
Ember.Handlebars.helper('iff', function(value,property, options) {
if(value === property){
return options.fn.apply();
} else {
return options.inverse.apply();
}
});
http://emberjs.jsbin.com/UhOWeWiJ/1/edit
http://emberjs.jsbin.com/UhOWeWiJ/2/edit
You will get a bound blocks error when you try and implement something like this and the values actually change
https://github.com/emberjs/ember.js/issues/2237
Uncaught You can't use appendChild outside of the rendering process
http://emberjs.jsbin.com/UhOWeWiJ/3/edit
http://emberjs.jsbin.com/UhOWeWiJ/3/edit

Ember/Handlebars: compare variable with string

I need to display some block depending on the current views variable in comparison to some string:
PSEUDO code is:
{{#if view.someVariable "desiredValue"}}
Hurray desiredValue exists in this view!
{{else}}
Sorry, doesn't match...
{{/if}}
Of course it doesn't work as if statement allows only one param. I tried with custom registerHelper of Handlebars, but it doesn't resolve the view.someVariable, instead uses it as a string (although view.someVariable is defined and has value).
Finally I also tried with Handlebar's registerBoundHelper - it resolves the params BUT doesn't support Handlebar's blocks, what's more tries to resolve the string as an object, so fail again. Pure madness!
My views are very dynamical they depends on many factors also from backend and approach from the pseudo code would be perfect for resolving it. Is there any way to do that?
Edit:
There is a sample of what I want ... http://jsfiddle.net/biesior/dMS2d/ looks quite trivial...
[if] statement inside the each is pseudo code of course
You can just declare a computed property, something like isDesired on your view, which would compare someVariable to your string:
App.MyView = Ember.View.extend({
// ...stuff...
isDesired: Ember.computed.equal('someVariable', 'desiredValue')
});
And have a simple conditional in the template:
{{#if view.isDesired}}
Hurray desiredValue exists in this view!
{{else}}
Sorry, doesn't match...
{{/if}}