单击 AngularJS 后如何隐藏 ui-grid 中的链接？

Question

使用Angular-UI-网格...我有以下数据（分页）：

姓名 | Link 一个 |显示隐藏乙 |显示隐藏

In my options:
cellTemplate:'<div>' +
               '  <a ng-click="grid.appScope.show(row)">Show</a> <a ng-click="grid.appScope.hide(row)">Hide' +'</div>' }

如何才能在单击 "Show" 时为该特定行显示隐藏。如果我单击 "Hide"，那么会为该特定行显示 "Show"?

Answer 1

我会使用布尔值来跟踪显示的内容。然后在你的方法中反转你的布尔值。

举个例子：

   $scope.isShowing = true;

然后修改你的锚。

 <a ng-hide="isShowing" ng-click="grid.appScope.show(row)">Show</a>

和

<a ng-show="isShowing" ng-click="grid.appScope.hide(row)">Hide' +'</div>'

并在您的 show/hide 方法中

$scope.isShowing = !$scope.isShowing

Answer 2

@Ashley Kurkowski 在 Angular ui-grid 中，您将无法访问 appScopeProvider 范围内的 isShowing。但是稍微调整一下你的方法是正确的。

cellTemplate: '<div><a ng-show="showRow" ng-click="grid.appScope.show(row); showRow = !showRow;">Show</a> <a ng-show="!showRow" ng-click="grid.appScope.show(row); showRow = !showRow;">Hide</a></div>'

我为此创建了一个 Plunkr。

单击 AngularJS 后如何隐藏 ui-grid 中的链接？

How to hide links from ui-grid after click in AngularJS?

angularjs

angular-ui-grid