AngularJS

Question

当我第二次触发 deleteQuestion() 时，2 questions 被删除。任何的想法？如果您需要查看我的更多代码，请告诉我。

controller.js

crtPromoCtrl.controller('surveyCtrl', ['$scope', 'surveySrv', function($scope, surveySrv)
{
    $scope.questions = surveySrv.getQuestions();

    $scope.editQuestion = function(index)
    {
        surveySrv.setEditQuestion(index);
    };

    $scope.deleteQuestion = function(index)
    {
        $(document).off('click', '#confirmationModal #confirm');
        $('#confirmationModal').modal('show');

        $(document).on('click', '#confirmationModal #confirm', function()
        {
            surveySrv.deleteQuestion(index);

            $scope.$apply();
        });
    };
}]);

service.js

crtPromoSrv.service('surveySrv', function()
{
    var questions = [];
    var editQuestion;

    this.getQuestions = function()
    {
        return questions;
    };

    this.addQuestion = function(question)
    {
        questions.push(question);
    };

    this.setEditQuestion = function(index)
    {
        editQuestion = questions[index];
    };

    this.getEditQuestion = function()
    {
        return editQuestion;
    };

    this.clearEditQuestion = function()
    {
        editQuestion = undefined;
    };

    this.deleteQuestion = function(index)
    {
        questions.splice(index, 1);
        console.log(questions);
    };
});

编辑：我认为这是一个事件传播问题，因为当我有 5 个问题时，它会在我删除 #2 时删除 #2 和 #3。

编辑：已修复，参见 controller.js 代码。

Answer 1

您似乎多次将 'click' 功能添加到 #confirmationModal #confirm 按钮。第一次调用 $scope.deleteQuestion 时，它添加了函数。第二次调用它时，它会再次添加所以当它被点击时，该函数被调用两次。

一个简单的修复方法是在再次添加之前取消绑定 'click' 事件 。像这样：$('#confirmationModal #confirm').off('click');

更好的解决方案是完全不对这些事件绑定使用 jQuery。使用简单的 Angular 模式指令（例如 Angular-UI 库中提供的指令）将是执行此操作的正确方法。然后你可以在按钮上有一个 ng-click 而永远不会有这个问题。

AngularJS - 共享服务对象被错误删除

AngularJS - Shared service object being deleted incorrectly

javascript

service

controller

twitter-bootstrap