将表格行从一个表格移动到另一个表格 - AngularJS

时间:2018-01-04 12:19:34

标签: javascript angularjs angularjs-ng-repeat

我有一个关于ng-repeat的问题,并将数据从一个表移动到另一个表。基本上我有一个"master"的表,并显示来自API请求的所有数据,在我在表中填充后,我在每行上都有一个按钮,其工作方式类似于"favorite-this-row"。用户点击"favorite-this-row"后,我希望它将行移动到另一个名为"favorite-table"的表格,并在此处显示数据。

这是我的" Master" -table:(我不会将整张桌子粘贴在有需要的部分)

<md-card flex="45" flex-sm="100" flex-md="100" flex-xs="100" 
    ng-show="(account|filter:searchName).length > 0"
    ng-repeat="account in containers | groupBy: 'accountId'  | toArray | filter:searchName track by $index ">

        ... Bunch of HTML code down......

    **//Favorite button**

<md-button ng-init="item.isfavorite = false;"
       ng-class="{yellow : item.isfavorite}"
       ng-click="item.isfavorite =!item.isfavorite; AddFavorite(item.isfavorite,container.containerId)"
       class="md-icon-button md-accent md-warn" aria-label="Favorite">      
<ng-md-icon icon="favorite" ng-init="item.isfavorite = false;"></ng-md-icon>
</md-button>

<p ng-if="item.isfavorite">Remove from favorites - {{item.isfavorite}} </p>
<p ng-if="!item.isfavorite">Add to favorite</p>

现在这是我的#34;收藏&#34; -table:

<table>
   <tr ng-repeat="x in containers" ng-show="item.isfavorite">
         <td>s{{ x.containerId }}</td>
         <td>s{{ x.accountId }}</td>
    </tr>
</table>

当我点击按钮<md-button ng-init="item.isfavorite = false;" ....>时,我希望它切片并移动到我最喜欢的表格,该表格只会重复containerIdaccountId。你可以看到我添加了ng-show="item.isfavorite",但它不起作用/显示。

AddFavorite(item.isfavorite,container.containerId)"只是控制器中的console.log

希望有人可以帮助我,谢谢!

1 个答案:

答案 0 :(得分:1)

正如@avius所说,它应该是account而不是项目也在favirote表中,它应该是x而不是item类似

<md-button class="md-raised" ng-click="account.isfavorite =!account.isfavorite">Button</md-button>

<p ng-if="account.isfavorite">Remove from favorites - {{account.isfavorite}} </p>
<p ng-if="!account.isfavorite">Add to favorite</p>



 <tr ng-repeat="x in containers" ng-show="x.isfavorite">

Check this plunker