如何让 angular js $http.delete 请求在图像应用程序中工作

Question

您好，我有一个相册应用，它从 jsonplaceholder.com

获取数据

我编写了一个 $http.delete() 方法，但它似乎没有按提供的索引删除照片

这里是 html：

        <div ng-app="myApp" ng-controller="AlbumCtrl">
            <div class="bar">
                <h3>Search by ID or Title</h3><input type="text" class="search" ng-model="q" placeholder="Enter your search terms" />
            </div>
            <div ng-repeat="album in albumData|filter:q" id="thumbWrapper">
                <h1>{{album.id}}</h1> 
                <h4>Title: </h4><button class="show" ng-click="showme = !showme">{{album.title}}</button>
                <div id="thumbList"ng-show="showme"class="albumContent">
                    <ul ng-controller="PhotoCtrl" id="thumbList">
                        <li ng-repeat="photo in photoData" ng-if="album.userId == photo.albumId">
                            <img id="view{{$index}}" ng-click="zoom($index)" ng-src={{photo.thumbnailUrl}}>
                            <p ng-click="delete($index)">x</p>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

和 js:

var app = angular.module('myApp', []);
app.controller('AlbumCtrl', function ($scope, $http) {
    $http.get("https://jsonplaceholder.typicode.com/albums").then(function(response) {
        $scope.albumData = response.data;
        console.log($scope.albumData);
    });
});
app.controller('PhotoCtrl', function($scope, $http) {
    $http.get("https://jsonplaceholder.typicode.com/photos").then(function(response) {
        $scope.photoData = response.data;

    });
    $scope.delete = function(index) {

        var del = "/" + (index + 1);
        $http.delete("https://jsonplaceholder.typicode.com/photos" + del).then(function(response) {
            console.log($scope.albumData);
        });
    };

任何帮助都会很棒！ :)

Answer 1

从照片数据中删除已删除的项目：

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

它是这样的：

var app = angular.module('myApp', []);
app.controller('AlbumCtrl', function ($scope, $http) {
    $http.get("https://jsonplaceholder.typicode.com/albums").then(function(response) {
        $scope.albumData = response.data;
        console.log($scope.albumData);
    });
});
app.controller('PhotoCtrl', function($scope, $http) {
    $http.get("https://jsonplaceholder.typicode.com/photos").then(function(response) {
        $scope.photoData = response.data;

    });
    $scope.delete = function(index) {

        //Remove item from photoData
        $scope.photoData.splice(index, 1);

        var del = "/" + (index + 1);
        $http.delete("https://jsonplaceholder.typicode.com/photos" + del).then(function(response) {
            console.log($scope.albumData);
        });
    };

如何让 angular js $http.delete 请求在图像应用程序中工作

How to get angular js $http.delete request working in image app

javascript

angularjs

http

http-delete