title: How to create an object with dynamic keys in expression of AngularJS v1?
body: <p>My attempts:</p>
  
  <pre><code>&lt;div ng-class="{'test': true}"&gt;Static key works fine&lt;/div&gt;
  &lt;div ng-class="{ ['te'+'st']: true }"&gt;How to "Create object with dynamic key in Angular expression"?&lt;/div&gt;
  &lt;div ng-class="{ 'te'+'st': true }"&gt;Attempt #2&lt;/div&gt;
  &lt;div ng-class="{ `te${'st'}`: true }"&gt;Attempt #3&lt;/div&gt;
  </code></pre>
  
  <p>You can view it at <a href="http://embed.plnkr.co/0xSn2CEkL3KaskeudOOe/" rel="nofollow">this plunk</a>.</p>
  
  <hr>
  
  <p>Edit 1:
  To make it crystal clear: I'm <strong>not</strong> looking for a way how to add dynamically classes on an element. Code above is just a minimal example of what I want to achieve - <strong>construct an object in <a href="https://docs.angularjs.org/guide/expression" rel="nofollow">Angular expression</a> with dynamic keys</strong>. Consider <code>ng-class</code> to be just some arbitrary directive taking an object as a parameter, it's used just for demonstration and testing.</p>
  
  <p>In JavaScript (ES6) it can be achieved like this: <code>{['te'+'st']: true}</code> which produces object (not string) <code>{test: true}</code>.</p>
  
  <p>In production code first part of expression is variable and the other is string, condition (value) wasn't hardwired <code>true</code> and also object is not composed of just one property. But I don't think it really matters, because question is about object and dynamic keys in ng expression and it IMO implies it's not restricted to only string literals concatenation (it wouldn't be very dynamic, would it).</p>