Question

我有一个用ng-repeat构建的表。在表格单元格中，我需要在用户点击链接时显示链接或下拉列表。所以我声明了我的html（JADE模板）：

tr(ng-repeat='table in importMeta.displayedTables track by $index')
    td
        a(ng-if='!table.editCache' ng-click='startEditDbTableCache(table)') {{dbTableCache(table)}}
        button(ng-if='table.editCache' bs-select ng-model='table.cache' bs-options='item.value as item.label for item in importCaches')

在我的控制器中，我在功能中切换表编辑/视图状态：

....
$scope.curDbTable = null;

$scope.startEditDbTableCache = function (tbl) {
        if ($scope.curDbTable) {
            $scope.curDbTable.editCache = false;
            $scope.curDbTable.editTemplate = false;
        }

        tbl.editCache = true;
        $scope.curDbTable = tbl;
    };

但是UI正在闪烁，因为它似乎是ng-if如果被评估两次，并且在某个时间点短时间内我在表格单元格中看到两个控件。

可以让AngularJS同时评估ng-if吗？

或者我可以用其他技巧显示下拉菜单？我使用ng-if因为我可以在表格中有很多行，而下拉列表可能包含很多项目，这就是为什么我需要ng-if而不是ng-show。

Answer 1

似乎问题不在AngularJS中，而是在CSS动画中使UI闪烁。经过一些CSS调整后 - 眨眼就消失了。

ng-if分两步评估，UI闪烁

1 个答案: