【问题标题】:Cannot read property 'splice' of undefined?无法读取未定义的属性“拼接”?
【发布时间】:2016-10-10 05:27:54
【问题描述】:

我正在使用 angular 和 php 构建一个项目,并且我试图从数据库表中删除一行。我不知道如何处理这个错误,有人可以帮忙吗?这是我的代码

用于检索的 php-get-allCustomers.php

<?php header('Content-Type: text/html; charset=utf-8');
  $con = mysqli_connect('localhost','root','','hamatkin');
  if(!$con){
    die("couldnt connect".mysqli_error);
  }
  $query = "SELECT `customer_id`, `kind_Of_Customer`, `first_name`, `last_name`, `id`, `city` FROM `customers`";
  $result = $con->query($query);
  $r = array();
  if( $result->num_rows>0){
    while($row = $result->fetch_assoc()){
      $r[] = $row;
    }
  }
  $res = json_encode($r);
   echo json_encode($res);
?>

用于检索的html代码:

<!DOCTYPE html>
<html >
<head >

</head>
<body>
    <h2>כרטיסי לקוחות</h2>
    <!-- <a href="/hamatkin/index.html#/customerCardDetails">לחץ לפרטי כרטיס לקוח</a> -->

    <div class="search">
       <label>חיפוש:</label>
       <input type="text" ng-model="search_query">
       <label>מיון לפי:</label>
       <select ng-model="order_query">
           <option value="kind_Of_Customer" >סוג לקוח</option>
           <option value="first_name">שם</option>
           <option value="id">ת"ז</option>
       </select>
       <label>מיון הפוך:</label>
       <input type="checkbox" ng-model="reverse_query" value="reverse" >
   </div>

    <div class="table-responsive">
      <table  class="customer-list table table-striped">
        <thead>
          <tr>
            <!-- <th>#</th> -->
            <th class="Column-Header">מספר לקוח</th>
            <th class="Column-Header">סוג לקוח</th>
            <th class="Column-Header">שם פרטי</th>
            <th class="Column-Header">שם משפחה</th>
            <th class="Column-Header">ת.ז</th>
            <th class="Column-Header">עיר</th>
            <!-- <th>כתובת</th> -->
            <!-- <th>מס' טלפון</th> -->
            <!-- <th>מס' טלפון 2</th> -->
            <!-- <th>אימייל</th> -->
            <!-- <th>פקס</th> -->
            <!-- <th>הופנה דרך</th> -->
            <!-- <th>הערות</th> -->
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat="x in customers | filter:search_query | orderBy: order_query:reverse_query">
            <!-- <td>{{$index + 1}}</td> -->
            <td>{{ x.customer_id}}</td>
            <td>{{ x.kind_Of_Customer}}</td>
            <td>{{ x.first_name }}</td>
            <td>{{ x.last_name }}</td>
            <td> {{ x.id}} </td>
            <td> {{ x.city}} </td>
            <td><button ng-click="delete(customers.customer_id, $index)">Delete</button><td>
            <!-- <td> {{ x.address}} </td> -->
            <!-- <td> {{ x.phone}} </td> -->
            <!-- <td> {{ x.phone_2}} </td> -->
            <!-- <td> {{ x.email}} </td> -->
            <!-- <td> {{ x.fax}} </td> -->
            <!-- <td> {{ x.referrer}} </td> -->
            <!-- <td> {{ x.comments}} </td> -->
          </tr>
        </tbody>
      </table>
    </div>
</body>
</html>

php - deleteCustomer.php:

<?php error_reporting(E_ALL); ini_set('display_errors', 1);
  $connect=mysqli_connect('localhost', 'root', '', 'hamatkin');

  if(isset($_GET['customer_id'])){
     $id=$_GET['customer_id'];
     $del="DELETE FROM customers WHERE customer_id='".$id."'";
     mysqli_query($connect,$del);
  }
?>

控制器 - 此控制器获取所有客户表数据并显示它。它工作正常。其余的是我尝试删除的内容。:

"use strict";

angular.module('dataSystem').controller('customerCardsCtrl', function($scope,$route,$location,$http) {
  $http({method:'GET', url:'api/get-allCustomers.php/'})
      .then(function(response) {
        var arr = JSON.parse(JSON.parse(response.data));
        $scope.customers = arr;
      })

      // This will log you the error code and trace, if there is an error.
  .catch(function(err) {
    console.log('err', err)
  });

  $scope.delete = function(deletingId, index){
      var params = $.param({"customer_id":deletingId})
      $http({
        url: "api/deleteCustomer.php",
        method:"GET",
        data:params

      }).success(function(data){
        $scope.customers = data;
        $scope.customers.splice(index,1);
        console.log(data)
      });

  }

【问题讨论】:

  • 错误意味着$scope.data在你的成功函数中没有定义。即找不到$scopedata
  • 我应该点什么? @BadHorsie
  • 只需使用data,您可以看到它是通过函数参数传递的。
  • @BadHorsie 控制台向我显示:“data.splice 不是函数”现在
  • splice() 是一个数组方法,所以如果data 不是一个数组,你就不能在它上面使用那个函数。我会检查data 的值并告诉我们。

标签: php angularjs


【解决方案1】:

我认为您在成功回调中尝试做的是从视图中删除已删除的客户。

试试看。

$scope.customers.splice(index,1);

在成功回调中

【讨论】:

  • 我编辑了代码控制台没有显示任何内容,现在当我按下删除按钮时,所有行都消失了,直到我刷新页面
  • 你为什么要这样做 $scope.customers = data;请删除此行。
  • 我删除了该行,现在它删除了每一行,但是当我刷新页面时,所有数据都回来了......当然它不会在 phpmyadmin 中删除
  • 好的,看来您为删除所做的调用响应成功,但实际上并未将其从服务器中删除。我可以看到的另一个问题是您正在尝试使用 GET 调用删除客户,它应该是 DELETE。请检查PHP服务器端代码是否正确执行。
  • 我改成 DELETE 但还是一样。检查 php 服务器代码是否正常执行是什么意思?
【解决方案2】:

在函数作用域之外初始化一个$scope.variable = [];然后

.success(function(data){
        $scope.variable = data;
        $scope.variable.splice(index,1);
      });

【讨论】:

  • 我试过了,但没用...未捕获的 SyntaxError: Unexpected identifier
  • 你能不能做一个console.log(data);就在 .success 函数中,然后进入浏览器的控制台向我们展示结果。
  • @jean-micheal 我编辑了代码控制台没有显示任何内容,现在当我按下删除按钮时,所有行都消失了,直到我刷新页面
  • 好吧,console.log(data) 应该返回一些东西,甚至是未定义的。您确定您没有更改任何代码吗?
  • @jean-michaelprovencher 这就是我改变的 }).success(function(data){ $scope.customers = data; $scope.customers.splice(index,1); console.log (数据) });你可以看看上面的代码
【解决方案3】:

$scope.data.splice(index, 1); 替换为简单的data.slice(index, 1);

返回的数据不在 $scope 中。

【讨论】:

  • 我按照你说的做了,但还是不行……控制台显示:“data.splice 不是函数
  • 正如@BadHorsie 上面所说,如果返回的数据不在数组中,那么您将继续收到该错误。
  • 我认为 OP 的意图是从 $scope 中删除已删除的数据,而不是处理从 AJAX 返回的任何数据。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2023-04-01
  • 1970-01-01
  • 2019-08-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多