2013-02-28 37 views
0

我有2個列表在我的應用程序和用戶應該拖放項目從一個列表到另一個。
當用戶從其中一個列表中刪除一個元素到另一個列表時,必須向服務器端代碼發出請求以更新數據庫中的字段(SelectedForDiscussion)。
這是在我的控制器的代碼:AngularJs 2承諾內一個手錶第二個從來沒有工作

$scope.$watch("questionsDiscuss", function (value) { 
    var question = $.Enumerable.From($scope.questionsDiscuss).Where(function (item) { return !item.SelectedForDiscussion }).FirstOrDefault() 
    if (question != undefined) { 

     questionSelectionService.UpdateQuestionSelectionStatus(question.Id, true) 
     .then(function (output) { 

      var question = $.Enumerable.From($scope.questionsDiscuss) 
           .Where(function (item) { return item.Id == output.data.questionId }) 
           .FirstOrDefault(); 
      var index = $.Enumerable.From($scope.questionsDiscuss).IndexOf(question); 

      if (question != undefined) 
       if (output.data.result != "success") { 
        $scope.questionsDiscuss.splice(index, 1); 
        $scope.questionsReceived.splice(0, 0, question); 
       } 
       else { 
        question.SelectedForDiscussion = true; 
        $scope.questionsDiscuss[index] = question; 
       } 
     }); 
    } 
    else { 
     var question = $.Enumerable.From($scope.questionsReceived).Where(function (item) { return item.SelectedForDiscussion }).FirstOrDefault(); 
     if (question != undefined) { 
      questionSelectionService.UpdateQuestionSelectionStatus(question.Id, false) 
      .then(function (output) { 
       var question = $.Enumerable.From($scope.questionsReceived) 
           .Where(function (item) { return item.Id == output.data.questionId }) 
           .FirstOrDefault(); 
       var index = $.Enumerable.From($scope.questionsReceived).IndexOf(question); 

       if (question != undefined) 
        if (output.data.result != "success") { 
         $scope.questionsReceived.splice(index, 1); 
         $scope.questionsDiscuss.splice(0, 0, question); 
        } 
        else { 
         question.SelectedForDiscussion = false; 
         $scope.questionsReceived[index] = question; 
        } 
      }); 
     } 

    } 

}, true); 

我有4 JavaScript的斷點置於內螢火蟲下列行:其中
2在下面的行:

if (question != undefined) { 

一個工作在:

var question = $.Enumerable.From($scope.questionsDiscuss) 
    .Where(function (item) { 
     return item.Id == output.data.questionId 
    }) 
    .FirstOrDefault(); 

,另一個在:

var question = $.Enumerable.From($scope.questionsReceived) 
    .Where(function (item) { 
     return item.Id == output.data.questionId 
    }) 
    .FirstOrDefault(); 

會出現以下情況:

斷點在:

if (question != undefined) { 

總是到達。

斷點在

var question = $.Enumerable.From($scope.questionsDiscuss) 
    .Where(function (item) { 
     return item.Id == output.data.questionId 
    }) 
    .FirstOrDefault(); 

也達到了。
另一個永遠不會到達。
兩個響應均正常(響應碼200)。
一切都應該完美地工作,但第二個承諾中的then子句永遠不會達到。
誰能告訴我我做錯了什麼?
服務器端應用程序是用C#編寫的ASP.NET MVC應用程序。

編輯1: 我想出了爲什麼會發生這種情況,我有一個解決它的方法。我對一個實際的解決方案感興趣。
問題是,當第二次調用$ http時,angularjs會拋出一個錯誤,然後吞下它。錯誤是:

消化alredy正在進行

我想這是因爲在我的指導我有這樣的代碼:

dndfunc = function (scope, element, attrs) { 

    // contains the args for this component 
    var args = attrs.dndBetweenList.split(','); 
    // contains the args for the target 
    var targetArgs = $('#' + args[1]).attr('dnd-between-list').split(','); 

    // variables used for dnd 
    var toUpdate; 
    var target; 
    var startIndex = -1; 

    // watch the model, so we always know what element 
    // is at a specific position 
    scope.$watch(args[0], function (value) { 
     toUpdate = value; 
    }, true); 

    // also watch for changes in the target list 
    scope.$watch(targetArgs[0], function (value) { 
     target = value; 
    }, true); 

    // use jquery to make the element sortable (dnd). This is called 
    // when the element is rendered 
    $(element[0]).sortable({ 
     items: 'div', 
     start: function (event, ui) { 
      // on start we define where the item is dragged from 
      startIndex = ($(ui.item).index()); 
     }, 
     stop: function (event, ui) { 
      var newParent = ui.item[0].parentNode.id; 

      // on stop we determine the new index of the 
      // item and store it there 
      var newIndex = ($(ui.item).index()); 
      var toMove = toUpdate[startIndex]; 

      // we need to remove him from the configured model 
      toUpdate.splice(startIndex, 1); 

      if (newParent == args[1]) { 
       // and add it to the linked list 
       target.splice(newIndex, 0, toMove); 
      } else { 
       toUpdate.splice(newIndex, 0, toMove); 
      } 

      // we move items in the array, if we want 
      // to trigger an update in angular use $apply() 
      // since we're outside angulars lifecycle 
      scope.$apply(targetArgs[0]); 
      scope.$apply(args[0]); 
     }, 
     connectWith: '#' + args[1] 
    }) 
} 

而且有2個呼叫在年底申請這觸發了我認爲的一個新的摘要週期。
無論如何,我固定它通過添加調用之前此調用申請:

  if (scope.updateLists != undefined) 
       scope.updateLists(); 

,避開手錶的所有代碼到updateLists功能。

而且因爲人們所提到的服務具有的東西,用它做我粘貼在它的相關代碼:

GetQuestionsReceived: function (eid, criteria, page, rows) { 

    var promise = this.GetQuestionsReceivedInternal(eid,criteria, page, rows).then(function (response) { 
     // The return value gets picked up by the then in the controller. 
     return response; 
    }); 
    // Return the promise to the controller 
    return promise; 
}, 

GetQuestionsReceivedInternal: function (eid, criteria, page, rows) { 

    return $http({ method: 'GET', 
     url: '../QuestionManagement/GetQuestions?eventId='+eid+'&page=1&rows=5&'+serialize(criteria) 
    }). 
     success(function (data, status, headers, config) { 
      // this callback will be called asynchronously 
      // when the response is available 
      results = data; 
     }). 
     error(function (data, status, headers, config) { 
      // called asynchronously if an error occurs 
      // or server returns response with an error status. 
      if (window.console && console.log) { 
       console.log("Could not obtain questions received. Error:" + data + "Status:" + status + "Headers:" + headers + "Config:" + config); 
      } 
     }); 
}, 

    GetQuestionsDiscuss: function (eid,criteria, page, rows) { 

    var promise = this.GetQuestionsDiscussInternal(eid,criteria, page, rows).then(function (response) { 
     // The return value gets picked up by the then in the controller. 
     return response; 
    }); 
    // Return the promise to the controller 
    return promise; 
}, 

GetQuestionsDiscussInternal: function (eid,criteria, page, rows) { 

    return $http({ method: 'GET', 
     url: '../QuestionManagement/GetQuestions?eventId=' + eid + '&page=1&rows=5&' + serialize(criteria) 
    }). 
     success(function (data, status, headers, config) { 
      // this callback will be called asynchronously 
      // when the response is available 
      response = data; 
     }). 
     error(function (data, status, headers, config) { 
      // called asynchronously if an error occurs 
      // or server returns response with an error status. 
      if (window.console && console.log) { 
       console.log("Could not obtain questions received. Error:" + data + "Status:" + status + "Headers:" + headers + "Config:" + config); 
      } 
     }); 

}, 
+0

我們可以看到返回承諾的服務嗎?你在延期對象上調用resolve()嗎? – 2013-02-28 21:24:04

+0

兩個建議; (1)'var index = ...;'開始的行可以,也許應該在它們各自的'if(question!= undefined){...}'塊中移動; (2)你確定'if(question!= undefined)'是正確的測試嗎?如果(!問題)'? – 2013-02-28 22:58:10

+0

對不起,應該是這樣的:「如果(問題)'如何? – 2013-02-28 23:43:16

回答

0

你有兩個代碼非常相似的塊,這可以推廣,並放置在一個函數包裝器,留下一個非常簡單的調用函數。

如果你能把所有東西都弄成這種形式,那麼我認爲你會發現它更容易調試。

這裏是一個試圖這樣做:

function updateSelectionStatus(qA, qB, bool) { 
    var en = $.Enumerable.From(qA); 
    var question = en.Where(function (item) { 
     return bool ? !item.SelectedForDiscussion : item.SelectedForDiscussion; 
    }).FirstOrDefault(); 
    if(question) { 
     questionSelectionService.UpdateQuestionSelectionStatus(question.Id, bool).then(function (output) { 
      if (output.data.result == "success") { 
       question.SelectedForDiscussion = bool; 
      } 
      else { 
       qA.splice(en.IndexOf(question), 1); 
       qB.unshift(question); 
      } 
     }); 
    } 
    return question; 
} 

$scope.$watch("questionsDiscuss", function (value) { 
    if (!updateSelectionStatus($scope.questionsDiscuss, $scope.questionsReceived, true) { 
     updateSelectionStatus($scope.questionsReceived, $scope.questionsDiscuss, false); 
    } 
}, true); 

我可能已經做了一些錯誤的假設和簡化太多(如:清洗內$.Enumerable.From,這似乎重新選擇爲外同樣的問題),所以你可能需要重寫我的代碼。

我在這裏提倡一個原則,而不是提供解決方案。

相關問題