当我进行角度调用时,jquery fadeOut只能工作一次吗?

时间:2017-10-31 21:40:04

标签: jquery angularjs slim

我知道他们有很多与此类似的问题,但我会真正具体。我的jquery脚本只能运行一次,然后我得到这个错误

angular.min.js:108 DELETE http://localhost:8080/todo/20 500 (Internal Server Error)

但它会在刷新时删除我的帖子。所以角度脚本正在工作,所以我猜它是我的jquery脚本

main.js

var app = angular.module('john',[]);

app.controller('myCtrl', function($scope, $http, $location){

$scope.deleteTask = function(id){

    $http.delete('/todo/' + id).then(function(data, response, status, headers, config){
            $http.delete('/todo/' + id);
            $scope.activePath = $location.path('/');
            console.log("it deleted");
        }, function(rejection){
            console.log("some error");
        });
    }


$scope.addTask = function(taskdata){


    $http.post('/todo', taskdata).then(function(response){
        // taskdata.task = '';
        console.log("it works");
    }, function(rejection){
        console.log("it didn't work");
    });


}


});
    $('#disappear').click(function(e){
        e.preventDefault();
        $('#gone').fadeOut(1000, function(){
            $(this).remove();
        });



    });

这是它的html代码

<div id="gone" class="myl" ng-controller="myCtrl">
    <li><h4>{{ task.task}}</h4></li>
    <small style="font-style:italic">{{task.created_at |date("m/d/Y")}}</small></br>

<button id="disappear" class="btn btn-sm btn-danger" ng-click="deleteTask({{task.id}})">Delete</button>
    </div>

1 个答案:

答案 0 :(得分:0)

由于您使用的是Jquery标记id选择器#disappear #gone,因此JQuery Events只会附加一次。这意味着它只能工作一次。

$ http.delete调用成功时执行fadeOut:

$http.delete('/todo/' + id).then(function(data, response, status, headers, config){
  $( 'task' + id ).fadeOut(1000, function(){
            $(this).remove();
        });

要实现这一点,我们需要在HTML中为任务div分配一个唯一的ID:

<div id="task{{task.id}}" class="myl" ng-controller="myCtrl">...