DurandalJS composition appelant Knockout deux fois

Question

J'utilise DurandalJS avec Knockout pour charger une page avec des données. Les données sont chargées avec un appel ajax, de sorte que les données ne sont pas disponibles jusqu'à ce que le rappel est exécuté. Qu'est-ce qui se passe est que lorsque les données sont finalement chargées et que j'appelle ko.applyBindings(model), il a déjà essayé de lier les données une fois, et il jette une erreur indiquant que les données ne peuvent pas être liées deux fois. Je voudrais empêcher Durandal de faire cela et me permettre d'appliquer manuellement les liaisons.

code:

define(['plugins/router', 'durandal/app', 'gcharts', 'jquery'], function (router, app, gcharts, $) { 

    var projectStatsModel = function (data) { 

     this.projectId = data.projectId; 
     this.projectName = data.projectName; 
     this.projectDescription = data.projectDescription; 
     this.projectPlatform = data.projectPlatform; 

     this.projectPointsLabel = "Total Points: " + data.projectNumPoints; 
     this.projectStoriesLabel = "Total Stories: " + data.projectNumStories; 
     this.projectCreatedDateLabel = "Created " + data.projectCreationDate; 
     this.projectUpdateDateLabel = "Last Updated " + data.projectModifyDate; 

     this.projectEpics = data.projectEpics; 
     this.projectStories = data.projectStories; 

     return this; 
    } 

    var ctor = function() { 

     function drawPage(data) { 
      var model = projectStatsModel(data); 
      ko.applyBindings(model); 
     } 

     function loadData() { 

      var projectId = router.activeInstruction().params[0]; 

      $.ajax({ 
       url: '/ClubhouseData/GetProjectDetails', 
       data: { 
        'projectId': projectId 
       }, 
       type: 'GET', 
       cache: 'false', 
       success: function (result) { 
        console.log(result); 
        drawPage(result); 
       } 
      }); 
     } 

     ctor.prototype.activate = function() { 
      loadData(); 
     } 
    }; 


    return ctor; 
}); 

Answer 1

Par mesure de sécurité avant de demander des liaisons Je vérifie toujours si l'élément est déjà lié à ma demande.

if (isBound("container")) 
    ko.cleanNode(document.getElementById('container')); 
// Bind 
ko.applyBindings(viewModel, document.getElementById("container")); 

Mon isBound Méthode:

var isBound = function (id) { 
    if (document.getElementById(id) != null) 
     return !!ko.dataFor(document.getElementById(id)); 
    else 
     return false; 
}; 

Cela empêchera votre erreur de se produisant, car il enlèvera la fixation avant de l'appliquer si elle est déjà liée.