Javascript 如何在重新排序后将项目添加到嵌套的角度ui树列表中?
我有一个嵌套的项目列表,类似于Javascript 如何在重新排序后将项目添加到嵌套的角度ui树列表中?,javascript,angularjs,ng-repeat,angular-ui-tree,Javascript,Angularjs,Ng Repeat,Angular Ui Tree,我有一个嵌套的项目列表,类似于Day>Exercises>set 每个天可以有许多练习,每个练习可以有许多集合。 对于每个列表,都有一个添加按钮。 在使用angular ui tree对它们重新排序之前,一切都很正常 如果您将第一个练习与第二个练习交换,然后单击+设置按钮,则新设置的位置不正确 这是我的建议 尝试交换当天的两个练习,然后单击属于其中一个练习的+集合 我知道问题是由ng init指令中设置的变量引起的,但我找不到任何解决方案 多谢各位 <ul ng-model="progr
Day>Exercises>set
每个
天
可以有许多练习
,每个练习
可以有许多集合
。
对于每个列表,都有一个添加按钮。
在使用angular ui tree对它们重新排序之前,一切都很正常 如果您将第一个练习与第二个练习交换,然后单击
+设置
按钮,则新设置的位置不正确
这是我的建议尝试交换当天的两个练习,然后单击属于其中一个练习的
+集合
我知道问题是由ng init
指令中设置的变量引起的,但我找不到任何解决方案
多谢各位
<ul ng-model="program.days" ui-tree-nodes>
<li ng-repeat="day in program.days" ng-init="dayIndex = $index" ui-tree-node>
<div class="day">{{ day.name }}</div>
<!-- Exercises -->
<ul ng-model="day.exercises" ui-tree-nodes>
<li ng-repeat="ex in day.exercises" ng-init="exIndex = $index" ui-tree-node>
<div>{{ ex.name }}</div>
<!-- Sets -->
<ul ng-model="ex.sets" ui-tree-nodes>
<li ng-repeat="set in ex.sets" ui-tree-node>
<div>{{ set.reps }} reps</div>
</li>
<li><button ng-click="addSet(dayIndex, exIndex)">+ set</button></li>
</ul>
<!-- end Sets -->
</li>
<li><button ng-click="addExercise(dayIndex)">+ exercise</button></li>
</ul>
<!-- end Exercises -->
</li>
<li><button ng-click="addDay()">+ day</button></li>
</ul>
<!-- end Days -->
-
{{day.name}
-
{{ex.name}}
-
{{set.reps}}reps
- +设置
- +练习
- +一天
Ng init对您正在做的事情没有好处。使用嵌套数组时,尝试传递对象,而不是索引,这将保持代码干净
例如:
<ul>
<li ng-repeat="day in program.days">
<div class="day">{{ day.name }}</div>
<ul>
<li ng-repeat="ex in day.exercises">
<div class="ex">{{ ex.name }}</div>
</li>
</ul>
</li>
<li><button ng-click="addExercice(day)">+ set</button></li>
</ul>
$scope.addExercice = function(day) {
day.exercices.push({});
};