angularjs - 如何更改 angularjs 中每行的按钮文本

Question

我正在从 angularjs 中的其余服务获取数据，并且数据使用 ng-repeat 以表格的形式显示。 我正在根据变量的值创建一个激活/停用按钮，如果该值为 true，则显示激活按钮，否则显示停用按钮。 这是我的 Controller

   $scope.btnText='Deactivate';
      $scope.active={};
     FetchDomainService.get(function(
       response) {
        $scope.domains = response;
        $scope.active=$scope.domains[0].isActive;
          if(  $scope.active==='true'){
  $scope.btnText==='Activate';
     }
    });

这是我的 html 代码

   <tr ng-repeat="domain in domains">

                <td>{{domain.clientId}}</td>
                <td>{{domain.jndisys}}</td>
                <td>{{domain.buildVersion}}</td>
                <td>{{domain.domainUuid}}</td>
                <td>{{domain.isActive}}</td>
                <td>

                    <button class="btn"
                        ng-click="">
         <span class="glyphicon glyphicon-pencil"></span>{{btnText}}
                    </button>
                </td>

            </tr>

现在的问题是...我如何更改每一行中的 btn 文本..我可以在所有行中更改它，但不能在单行中更改它。我需要检查每一行，然后更改按钮文本。 isActive 是一个 bool 值，如果为 true，则按钮文本为“激活”；如果 isActive 值为 false，则按钮文本为“停用”。

Answer 1

您可以在收到数据时向数据中的每个项目添加一些字段，例如 isActive。然后根据该字段的值在 ng-repeat 显示按钮。 您可以使用 native JavaScript 函数作为 map 或 forEach 来添加此值。

例如:

  FetchDomainService.get(
    function (resp) {
      $scope.items = resp.map(function (item) {
        item.isActive = true;
        return item;
      });
    }
  );

要显示/隐藏文本 - 使用此值 isActive 和 AngularJS 指令 ng-show、ng-hide 或 ng-if。

<span ng-hide="item.isActive">Activate</span>
<span ng-show="item.isActive">Deactivate</span>

演示:http://plnkr.co/edit/cYm0R8r4iFygk9A8iVPj?p=preview