Angularjs - удаление строки таблицы (с использованием ngRoute, factory)

У меня есть три HTML-файла и пытается вставить, удалить данные в таблицу. Мне удалось вставить данные в таблицу, но я не могу их удалить. Я думаю, что я не возвращаю правильное значение или, возможно, что-то еще не так. Любое помогает, пожалуйста? (Я прокомментировал все части, связанные с операцией удаления)

main.html

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>index</title>
    <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script>
    <link rel="icon" href="data:;base64,=">
</head>

<body>
    <ul class="papa">
        <li><a href="/1_input">input</a></li>
        <li><a href="/2_output">output</a></li>
    </ul>

   <ng-view></ng-view>

    <script>
    var app1 = angular.module('myApp', ['ngRoute']);
    app1.config(['$routeProvider', '$locationProvider',function($routeProvider, $locationProvider) {
        $routeProvider
        .when('/1_input', {
          controller: 'input_control',
          templateUrl: '/1_input.html'
       })
        .when('/2_output/:name/:kor/:eng/:math', {
          controller: 'output_control',
          templateUrl: '/2_output.html'
        })

        // .when('/2_output', {
        //   controller: 'delete_control',
        //   templateUrl: '/2_output.html'
        // })
        // .when('/2_output/:index', {
        //   controller: 'output_control2',
        //   templateUrl: '/2_output.html'
        // })
        .otherwise({redirectTo:'/1_input'});

        $locationProvider.html5Mode({ enabled: true, requireBase: false });
    }]);

    app1.controller('input_control', function($scope, $location, DataService){
        $scope.loadView2 = function(){
            DataService.set($scope.name, $scope.kor, $scope.eng, $scope.math);
          $location.path('/2_output/'+$scope.name+'/'+$scope.kor+'/'+$scope.eng+'/'+$scope.math);
       }
    });
    app1.controller('output_control',function($scope, DataService){
          $scope.list77 = DataService.get();
    });

    // app1.controller('delete_control', function($scope, $location, DataService){
    //  $scope.delete = function(xx){
    //      DataService.delete88(xx);
    //      $location.path('/2_output/'+xx);
    //  }
    // });
    // app1.controller('output_control2',function($scope, DataService){
    //    $scope.list77 = DataService.delete88(xx);
    // });

    app1.factory('DataService', function(){
        var appData = [];
        var appData1 = [];
        function set(data1, data2, data3, data4){
            appData.push({
                id: data1,
                kor: parseInt(data2),
                eng: parseInt(data3),
                math: parseInt(data4),
                tot: parseInt(data2)+parseInt(data3)+parseInt(data4),
                avg: (parseInt(data2)+parseInt(data3)+parseInt(data4))/3
            });
        }
        function get(){return appData}

        // function delete88(xx){
        //  return appData.splice(xx, 1);
        // }
        // //function del_get(){return appData1}

        return{ set:set, get:get/*, delete88:delete88*/}
    })

</script>

1_input.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial- scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>1_input</title>
</head>

<body>
    name:<input type="text" ng-model="name"/> <br/>
    kor_:<input type="text" ng-model="kor"/> <br/>
    eng_:<input type="text" ng-model="eng"/> <br/>
    math:<input type="text" ng-model="math"/> <br/>
    <br>
    <button ng-click="loadView2()">to output page</button>
 </body>
 </html>

2_output.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>2_output</title>
    <style>
      table, th, td{
            text-align: center;
            border: 1px solid grey;
            border-collapse: collapse;
            padding: 5px;
      }
      table tr:nth-child(odd){ background-color: #f2f2f2; }
      table tr:nth-child(eve){ background-color: #ffffff; }
    </style>
</head>

<body>
    <table>
        <tr>
            <th>name</th>
            <th>kor</th>
            <th>eng</th>
            <th>math</th>
            <th>tot</th>
            <th>avg</th>
            <!-- <th>del</th> --> 
        </tr>
        <tr ng-repeat="listabc in list77 track by $index">
            <td>{{listabc.id}}</td>
            <td>{{listabc.kor}}</td>
            <td>{{listabc.math}}</td>
            <td>{{listabc.eng}}</td>
            <td>{{listabc.tot}}</td>
            <td>{{listabc.avg}}</td>
            <!-- <td><button ng-click="delete($index)">삭제</button></td> -->
        </tr>
    </table>

</body>
</html>
Источник

1 ответ

Я не вижу, куда вы загружаете свои данные. В вашем контроллере удаления, где вы загружаете list77?

Источник
Другие вопросы по тегам