EVOLUTION-MANAGER

Edit File: trkslct.html

<a href='https://github.com/angular/angular.js/edit/v1.3.x/docs/content/error/ngOptions/trkslct.ngdoc?message=docs(error%2Ftrkslct)%3A%20describe%20your%20change...' class='improve-docs btn btn-primary'><i class="glyphicon glyphicon-edit">&nbsp;</i>Improve this Doc</a>

<h1>Error: error:trkslct
  <div><span class='hint'>Comprehension expression cannot contain both `select as` and `track by` expressions.</span></div>
</h1>

<h2>Description</h2>
<div class="description">
  <p>NOTE: This error was introduced in 1.3.0-rc.5, and was removed for 1.3.0-rc.6 in order to
not break existing apps.</p>
<p>This error occurs when &#39;ngOptions&#39; is passed a comprehension expression that contains both a
<code>select as</code> expression and a <code>track by</code> expression. These two expressions are fundamentally
incompatible.</p>
<ul>
<li>Example of bad expression: <code>&lt;select ng-options=&quot;item.subItem as item.label for item in values track by item.id&quot; ng-model=&quot;selected&quot;&gt;</code>
<code>values: [{id: 1, label: &#39;aLabel&#39;, subItem: {name: &#39;aSubItem&#39;}}, {id: 2, label: &#39;bLabel&#39;, subItem: {name: &#39;bSubItem&#39;}}]</code>,
<code>$scope.selected = {name: &#39;aSubItem&#39;};</code></li>
<li>track by is always applied to <code>value</code>, with purpose to preserve the selection,
(to <code>item</code> in this case)</li>
<li>To calculate whether an item is selected, <code>ngOptions</code> does the following:<ol>
<li>apply <code>track by</code> to the values in the array:
In the example: [1,2]</li>
<li>apply <code>track by</code> to the already selected value in <code>ngModel</code>:
In the example: this is not possible, as <code>track by</code> refers to <code>item.id</code>, but the selected
value from <code>ngModel</code> is <code>{name: aSubItem}</code>.</li>
</ol>
</li>
</ul>
<p>Here&#39;s an example of how to make this example work by using <code>track by</code> without <code>select as</code>:</p>
<pre><code>&lt;select ng-model=&quot;selected&quot; ng-options=&quot;item.label for item in values track by item.id&quot;&gt;
</code></pre>
<p>Note: This would store the whole <code>item</code> as the model to <code>scope.selected</code> instead of <code>item.subItem</code>.</p>
<p>For more information on valid expression syntax, see &#39;ngOptions&#39; in <a href="api/ng/directive/select">select</a> directive docs.</p>

</div>