【问题标题】:Move table row from one table to another - AngularJS将表格行从一个表格移动到另一个表格 - AngularJS
【发布时间】:2018-01-04 20:46:47
【问题描述】:

我有一个关于ng-repeat 以及将数据从一个表移动到另一个表的问题。基本上我有一个表"master" 并显示来自API 请求的所有数据,在我将它填充到表中之后,我在每一行上都有一个按钮,其工作方式类似于"favorite-this-row"。在用户单击"favorite-this-row" 后,我希望它将该行移动到另一个名为"favorite-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>

现在这是我的“最爱”表:

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

当我单击按钮 &lt;md-button ng-init="item.isfavorite = false;" ....&gt; 时,我希望它切片并移动到我最喜欢的重复 containerIdaccountId 的表。如您所见,我添加了ng-show="item.isfavorite",但它不起作用/显示。

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

希望有人能帮助我,谢谢!

【问题讨论】:

  • 首先你不应该有ng-init="item.isfavorite = false;",因为它应该是默认的,或者如果不是,我建议你在控制器而不是DOM中初始化它。似乎你正在循环通过account in containers,所以你会有account而不是item
  • 所以我应该将所有 item.isfavorite 更改为 container.isfavorite 并删除 ng-init?但是为什么它没有显示在“最喜欢的”表中。 ng-repeat 是容器而不是帐户
  • item.isfavorite 更改为 account.isfavorite 应该足以解决您的问题。它确实显示在收藏夹中,因为您正在重复 xcontainers 并使用相同的 x 来显示子属性,而在主表中您正在重复 accountcontainers 但您正在使用 item 由您的提供的代码不存在。

标签: javascript angularjs angularjs-ng-repeat


【解决方案1】:

正如@avius 所说,它应该是account,而不是最喜欢的表中的项目,它应该是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

【讨论】:

  • 太棒了,我改成了“account.isfavorite”和 ng-repeat="x.isfavorite" 并且成功了 :)
猜你喜欢
  • 2020-10-29
  • 1970-01-01
  • 2015-08-15
  • 2021-10-03
  • 1970-01-01
  • 2013-07-03
  • 2020-05-21
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多