S
S
Sergei2016-12-07 11:31:45
Angular
Sergei, 2016-12-07 11:31:45

How to calculate and store a local variable in ng-repeat angular?

Hello.
There is the usual familiar ng-repeat of the form:

<div ng-repeat="(position, task) in Tasks.plannedTasks">
     {{(task.plan - (TasksTimeSpent[task.id][task.worker]).toFixed(2)}}
</div>

And now the need arose, if the value:
{{(task.plan - (TasksTimeSpent[task.id][task.worker]).toFixed(2)}}
< 0 - tint the block in red
task.plan and task.worker can change, which naturally entails a change in the value that needs to be checked
Is it possible somehow inside ng-repeat, roughly speaking, to assign the difference to a temporary variable and further for output and conditions on backlight use it? Do not hunt 2 times to consider the same thing.
The option of calculating the value in advance in the controller is not suitable. this entails the need to attach a watcher to tasks, and the value itself is not used anywhere in the application logic and is needed only in this block and only to visually display the difference between the two indicators.

Answer the question

In order to leave comments, you need to log in

2 answer(s)
S
Sergey, 2016-12-07
@Neversmille

Solved the problem like this:

<div
  ng-init="curDif=(task.scrum_task_final_plan - (TasksTimeSpent[task.scrum_task_pf_task_id][task.scrum_task_worker] || 0)).toFixed(2)"
>
  {{curDif}}
        <div ng-if="isOverdue(curDif)">
    <i class="fa fa-exclamation-triangle text-red" aria-hidden="true"></i>
  </div>
</div>

Yes it is possible to tell what to take out so logic on neoch. And here I agree, but in this case, when you just need an icon for which you don’t care in the context of logic, it’s even better than a watcher.

_
_ _, 2016-12-07
@AMar4enko

The correct way out of the situation is to process tasks when they hit the controller, and not when they are output.
When outputting, you should have the code:

<div ng-repeat="(position, task) in Tasks.plannedTasks" ng-class="{'is-overdue': task.isOverdue}">
     {{(task.plan - (TasksTimeSpent[task.id][task.worker]).toFixed(2)}}
</div>

Then you add everything you need to the .is-overdue class.
If for some reason you don't have a single place where you can prepare your data for later use, you've misdesigned the system.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question