How can we concatenate an expression value with some string and evaluate the resulting expression?

If we have one object prefix and I wanted to concatenate its value with some string. e.g

{{prefix"Output"}}

I would like to first evaluate the prefix value and then concatenate it with the "Output" string.

So the resulting expression may be something like "UnitOutput" where Unit is the value of the prefix.

Lastly I want the concatenated expression from above to be evaluated as well in that case resulting value will be the value of "UnitOutput".

How can we concatenate an expression value with some string and evaluate the resulting expression?

If we have one object prefix and I wanted to concatenate its value with some string. e.g

{{prefix"Output"}}

I would like to first evaluate the prefix value and then concatenate it with the "Output" string.

So the resulting expression may be something like "UnitOutput" where Unit is the value of the prefix.

Lastly I want the concatenated expression from above to be evaluated as well in that case resulting value will be the value of "UnitOutput".

• javascript
• string
• polymer
• mustache
• ractivejs

Share Improve this question Follow asked Apr 24, 2015 at 8:03 RazaRaza 31011 gold badge44 silver badges1111 bronze badges 1

• I actually want to achieve something like this {{ {{prefix}}"Output" }} – Raza Commented Apr 24, 2015 at 11:12

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 1

The keyword prefix did not work for me. I am assuming it is a reserved keyword. I will use pref in this example.

Html

<paper-input value="{{pref}}"></paper-input>
<span>Output: {{result}}</span>

Javascript

Polymer({
    pref: '',
    result: 'Output',
    prefChanged: function(oldValue, newValue) {
        this.result = newValue + 'Output';
        // evaluate result here
    }
}

Or you could use Polymers observer pattern

Html

<paper-input value="{{xyz.prefix}}"></paper-input>
<span>Output: {{result}}</span>

Javascript

Polymer({
    result: '',
    observe: {
        'xyz.prefix': 'validate'
    },
    validate: function(oldValue, newValue) {
        this.result = newValue + 'Output';
    },
    ready: function() {
        this.xyz = {
            prefix: 'test'
        }
    }
});

If you're observing Arrays please refer to observe-js

doing like

"{{variable}} Output"

should work

With RactiveJS it's simply:

{{ this[prefix + "Output"] }}

See http://jsfiddle/236bsky0/. this refers to current context or root, but can be another reference if you like.

You can also use a function : {{ getValue(variable) }} In your element, just declare your function : getValue: function(var) { return var + "Output";}