单击ng-repeat内的按钮后,如何将按钮更改为文本?

时间:2018-08-06 18:31:57

标签: angularjs

这是页面视图-

enter image description here

这是角度代码-

<tr ng-repeat="(key,value) in requestsObj">
    <!-- <td>{{requestsObj[key].bookingId}}</td> -->
  <td>{{requestsObj[key].d}}</td>
  <td >{{requestsObj[key].user}}</td>
  <td>{{requestsObj[key].foodType}}</td>
  <td>{{requestsObj[key].numOfPeople}}</td>
  <td>{{requestsObj[key].address}}</td>



  <td ng-if="!status(requestsObj[key].bookingId,requestsObj[key].accepted)" >
    <button ng-click='accept(requestsObj[key].bookingId,requestsObj[key].accepted)'>Accept</button>
    <button ng-click='decline(requestsObj[key].bookingId)'>Decline</button>
  </td>
    <td ng-if="status(requestsObj[key].bookingId,requestsObj[key].accepted)" ng-bind="Currentstatus"></td>
</tr>

因此,我想要的是单击接受或拒绝按钮后,该行应动态显示已接受/已拒绝。我该如何实现?

1 个答案:

答案 0 :(得分:2)

让我们稍微整理一下代码

<tr ng-repeat="value in requestsObj">
<!-- <td>{{value.bookingId}}</td> -->
  <td>{{value.d}}</td>
  <td>{{value.user}}</td>
  <td>{{value.foodType}}</td>
  <td>{{value.numOfPeople}}</td>
  <td>{{value.address}}</td>

  <td ng-if="!value.status">
    <button ng-click="status(value,'accept')">Accept</button>
    <button ng-click="status(value,'decline')">Decline</button>
  </td>
  <td>{{ value.status }}</td>
</tr>

值的字面意思是requestsObj [key],这里是有效的plunker

有很多方法可以执行此操作,但这是处理控制器中的click事件的一种方法

  $scope.status = function(item,status){
    item.status = status;
    //send to api here?
  };
相关问题