按日期过滤降序按AngularJs中的所有CRUD操作

时间:2016-04-30 08:04:42

标签: angularjs

我有一个包含100行的表格,如果我输入一个新行,它会添加它并显示在表格顶部

<table class="table">
 <tr ng-repeat=" item in itemlist | orderBy:createdat:true">
<td>//code goes here</td>
<td><button ng-click="del(item)" class="fa fa-trash"></button></td>
</tr>
</table>

我有一个删除按钮,但问题是,当我删除任何特定行时,它只删除该特定行,但仍显示该行存在于表中,直到页面被刷新。所以任何想法......对我来说都会有很大的帮助.... 这是代码....只需复制plunker中的代码

在HTML中

 <div ng-app>
 <div ng-controller="FooController">
<table>


    <tr ng-repeat="item in items | orderBy:'num':true">
        <td>{{item.num}} :: {{item.desc}}</td>
        <td><button class="fa fa-trash" ng-click="del($index)">
        delete
        </button></td>
    </tr>
    </table>
</div>

    在JS文件中

 function FooController($scope) {
$scope.items = [
    {desc: 'a', num: 1},
    {desc: 'b', num: 2},
    {desc: 'c', num: 3},
];
$scope.del=function(idx){
       $scope.items.splice(idx,1)
}
} 

1 个答案:

答案 0 :(得分:0)

HTML部分

   <table>
     <tr ng-repeat="item in items | orderBy:'num':true">
    <td>{{item.num}} :: {{item.desc}}</td>
    <td>
     <button class="fa fa-trash" ng-click="del(item)">
       delete
     </button></td>
    </tr>
   </table>

Javascript Part

 $scope.items = [
{desc: 'a', num: 1},
{desc: 'b', num: 2},
{desc: 'c', num: 3},
];
$scope.del=function(idx){
   $scope.items.splice($scope.items.indexOf(idx),1)
}