2013-05-15 14 views
6

Ho un modello di vista che utilizza una funzione di osservazione osservabile personalizzata per l'ordinamento. Quando provo a eseguire questo, si dice: "... non ha metodi 'sortByProperty'".Come caricare le funzioni personalizzate KnockoutJS con RequireJS?

Come caricare il file handlers.js per farlo funzionare?

handlers.js:

define(['knockout'], function(ko) { 
     'use strict'; 

     ko.observableArray.fn.sortByProperty = function (prop, order) { 
      this.sort(function (obj1, obj2) { 
       var result; 
       if (obj1[prop] == obj2[prop]) 
        result = 0; 
       else if (obj1[prop] < obj2[prop]) 
        result = -1; 
       else 
        result = 1; 

       return order === "desc" ? -result : result; 
      }); 
     }; 

    }); 

viewmodel.js:

define([ 
     'knockout', 
     'js/extends/handlers' 
    ], function(ko) { 
     'use strict'; 

     var LabelsModel = function() { 
      var self = this; 

      self.availableLabels = ko.observableArray(); 
      self.selectedLabel = ko.observable(); 
      self.sortBy = ko.observable(); // What field to sort by 
      self.sortOrder = ko.observable(); // Sort order. asc or desc. 

      // Returns the labels for the current page 
      self.pagedRows = ko.computed(function() { 
       // Sorts the labels 
       return self.availableLabels.sortByProperty(self.sortBy(), self.sortOrder()); 
      }); 

     }; 

     return LabelsModel; 

    }); 

risposta

1

Devi fare prima sicuri KnockoutJS è definito, quindi caricare il plugin, e, infine, lanciare la vostra applicazione . Questo penso sia come dovrebbero essere caricati tutti i plugin per le librerie. Ecco come si può fare:

require.config({ 
     paths: { 
     jquery: 'libs/jquery-1.9.0.min', 
     ko: 'libs/knockout-2.2.1.min' 
    } 
}); 

require(['jquery', 'ko'], 
    function($, ko) { 
     // ensure KO is in the global namespace ('this') 
     if (!this.ko) { 
      this.ko = ko; 
     }; 

     requirejs(['handlers'], 
      function() { 
       require(['app'], 
        function(App) { 
         App.initialize(); 
        } 
       ); 
      } 
     ); 
    } 
); 

ho avuto molte più librerie così ho tagliato verso il basso un po 'solo per JQuery e KnockoutJS, ma fondamentalmente si:

  1. dichiarare dove le librerie
  2. richiede di caricarli
  3. richiede il caricamento dei plugin per le tue librerie, qui i gestori di KnockoutJS
  4. carica la tua app (convenientemente chiamata ... 'app' qui :-). Qui è dove devi inizializzare i tuoi modelli di vista e collegarli agli elementi DOM. Questo è probabilmente il punto in cui sono state caricate tutte le librerie e i plugin.
+0

Grazie. Caricarlo con requirejs ha fatto il trucco. – Sindre

+0

@Sindre bello! Grazie e buona fortuna! – Jalayn

+0

Non dovresti aver bisogno di renderlo globale per il tuo particolare scenario. Sembra che il tuo campione originale funzioni correttamente. Questo è il modo in cui carico le estensioni. –

Problemi correlati