I found that ng-init is not updated after rowIndex is updated.

<div ng-init="item = getItem(rowIndex)">
   {{ item.Name }} 
</div>

item is not updated after rowIndex is changed (even if changes are made with $timeout)

Is there other directive that allows to avoid using the following dirty trick:

<div ng-repeat="item in [getItem(rowIndex)]">
   {{ item.Name }} 
</div>

I found that ng-init is not updated after rowIndex is updated.

<div ng-init="item = getItem(rowIndex)">
   {{ item.Name }} 
</div>

item is not updated after rowIndex is changed (even if changes are made with $timeout)

Is there other directive that allows to avoid using the following dirty trick:

<div ng-repeat="item in [getItem(rowIndex)]">
   {{ item.Name }} 
</div>

• javascript
• angularjs

Share Improve this question Follow asked May 2, 2018 at 15:09 Pablo HoneyPablo Honey 1,09611 gold badge1111 silver badges2323 bronze badges 1

• ng-repeat has a watcher (over a collection), so just get a watcher any other way. That depends on how rowIndex is updated. If somewhere within an input filed, use ng-changed="updateItem(rowIndex,item)". If somewhere else, then use $scope.$watch('item', function() {$scope.item = getItem(rowIndex); ... – Aleksey Solovey Commented May 2, 2018 at 15:13

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 10

Another approach is to set the variable inside a bogus attribute:

<div x="{{item = getItem(rowIndex)}}">
    {{ item.Name }} {{item.Value}}
</div>

On each digest cycle the value of item will be updated.

In this case where item has more that one property, the getItem function needs to be invoked only once.

Keep in mind that it would be even more efficient for the controller to update the value of item only once when rowIndex changes instead of invoking the getItem function every digest cycle.

---

Avoid using ng-init

Avoid using ng-init. It tangles the Model and View, making code difficult to understand, test, debug, and maintain. Instead initialize the Model in the controller.

From the Docs:

ngInit

This directive can be abused to add unnecessary amounts of logic into your templates. There are only a few appropriate uses of ngInit, such as for aliasing special properties of ngRepeat, as seen in the demo below; and for injecting data via server side scripting. Besides these few cases, you should use controllers rather than ngInit to initialize values on a scope.

— AngularJS ng-init Directive API Reference

ngInit does not update. It's a one-shot directive. You should just call the function from within the curly braces, since you are wanting to watch for changes to rowIndex:

<div>
  {{ getItem(rowIndex).Name }}
</div>

This could hurt performance on large lists, since getItem will be called on every digest cycle, but it's easy to read.

https://plnkr.co/edit/cZ2SG6nf2SufdAWe1ye7?p=preview