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

Question

Using Angular-UI-Grid...我有以下数据（分页）：

姓名 |链接一 |显示隐藏乙 |显示隐藏

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

如果我单击"显示"，则会显示该特定行的隐藏。如果我单击"隐藏"，则显示该特定行的"显示"？

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>'

并在您的显示/隐藏方法中

$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。