How to join a static string and a dynamic property to pass to a helper?

Question

How can I join a static string and a dynamic property to pass to a helper?

The following does not work:

{{svg 'icon-' model.prop1}}

Thanks

score 2 · Answer 1 · answered Apr 03 '15 at 01:42

2

You could implement a custom helper that concatenation two values then use it as a subexpression, e.g. 'concat'

{{svg (concat 'icon-' model.prop1)}}

answered Apr 03 '15 at 01:42

jmurphyau

2,309
13
11

Thanks. Do you have an example of the concat helper? – Michael Apr 03 '15 at 13:52
Ok I was able to make it work. However, I cannot call toLowerCase on `model.pro1`, why `{{ model.prop1.toLowerCase() }}` does not work? – Michael Apr 03 '15 at 14:14
You can't call function in templates – jmurphyau Apr 03 '15 at 14:15
oh so I have to create another helper for toLowerCase? – Michael Apr 03 '15 at 14:16
Ok I created a toLowerCase helper, it seems to work but it doesn't if I nest it `{{svg (concat 'icon-' (toLowerCase model.prop1))}}` If I have only `{{concat 'icon-' (toLowerCase model.pro1)}}`, it works. – Michael Apr 03 '15 at 14:26

score 1 · Accepted Answer · answered Apr 05 '15 at 00:23

This is the wrong approach. Either compute the final name of your icon in the controller or view, or create a new property in your model called icon e.g.

DS.Model.extend({
   icon: function() {
     return 'icon-' + this.get('prop1').toLowerCase();
   }.property('prop1');
  ....

controller/view:

   icon: function() {
     return 'icon-' + this.get('model.prop1').toLowerCase();
   }.property('model.prop1');

How to join a static string and a dynamic property to pass to a helper?

2 Answers2