2013-06-27 3 views
3

J'ai un peu de mal à obtenir sammyjs pour jouer avec requirejs. L'appel $.sammy échoue et l'erreur indique que sammy n'est pas défini dans l'espace de noms jQuery.Utiliser SammyJs avec RequireJs

Voici mon besoin config

require.config 
    baseUrl: '/Scripts' 
    waitSeconds: 10 
    paths: 
    bootstrap:    './lib/bootstrap/bootstrap'    
    domReady:     './lib/domReady/domReady' 
    knockout:     './lib/knockout/knockout-2.2.1.debug' 
    jquery:     './lib/jquery/jquery-1.9.1' 
    sammy:     './lib/sammy/sammy-0.7.4' 
    myPage:     './app/pages/myPage' 
    myViewModel:    './app/viewModels/myViewModel' 
    shim: 
    bootstrap: 
     deps: ["jquery"] 
    sammy: 
     deps: ["jquery"] 
     exports: "Sammy" 

Voici ma page javascript

require ['knockout', 'myViewModel', 'domReady!' ], (ko, viewModel) -> 
    myViewModel = new viewModel  
    ko.applyBindings(myViewModel) 

Voilà mon avis modèle

define [ 'jquery', 'sammy', 'knockout' ], ($, sammy, ko) -> 
    class myViewModel 
    constructor: (options) -> 
     self = @ 
     @sammypath = ko.observable(1) 

     @router = $.sammy(-> 
     @get '#/', (data) -> 
      self.sammypath(1) 
    ) 
     @router.run() 

Cependant, je reçois une erreur lorsque je tente d'appeler $.sammy

Uncaught TypeError: Object function (selector, context) 
{ // The jQuery object is actually just the init constructor 'enhanced' 
    return new jQuery.fn.init(selector, context, rootjQuery); } 
has no method 'sammy' 

Je suppose que c'est quelque chose qui ne va pas avec le require.config mais pour être honnête, je ne suis pas sûr.

Le fichier sammy-0.7.4.js est téléchargé correctement.

Le sammy qui est passé à travers la définir dans le modèle de vue est non nul

Je coincé un point de rupture sur le fichier sammy et il Reçoit et reconnaît qu'il est un module AMD. Je ne suis pas sûr pourquoi il ne s'ajoute pas à l'espace de noms jQuery.

J'ai vérifié deux fois que la page a été chargée correctement en premier, mais le module domReady s'occupe de cela. J'utilise aussi coffeescript mais je ne pense pas que cela devrait poser problème.

Répondre

3

Pour obtenir sammy au travail, je viens de déposer la notation $. depuis que je suis injecter

@router = sammy(-> 
    @get('#/', (data) -> 
    self.sammypath(1) 
) 
) 

Je ne peux pas sembler obtenir $.sammy pour travailler malheureusement. The RequireJs documentation a quelques conseils quant à la façon d'obtenir $.sammy pour travailler peut-être

var require = { 
    deps: ["some/module1", "my/module2", "a.js", "b.js"], 
    callback: function(module1, module2) { 
     //This function will be called when all the dependencies 
     //listed above in deps are loaded. Note that this 
     //function could be called before the page is loaded. 
     //This callback is optional. 
    } 
}; 

On dirait que je pouvais utiliser le rappel pour que cela fonctionne avec quelque chose comme ça

var require = { 
    deps: ["jquery", "sammy"], 
    callback: ($, sammy) -> 
     $.sammy = sammy 
} 

Mais je ne peux pas obtenir ceci pour jouer avec le require.config, si quelqu'un sait comment trier ceci laissez-moi savoir! J'ai vu d'autres personnes faire quelque chose comme ça avec knockout et ko et le plugin de cartographie ko.mapping

0

Sammy devrait bien jouer avec requirejs et sait déjà qu'il a besoin du module jquery chargé.

Je suis nouveau sur sammyjs, alors peut-être que les réponses ci-dessus étaient avant que sammy ne soit compatible avec amd?

Ceci est un extrait du current sammyjs version, qui montre que ça devrait être bon pour requirejs ... au moins, je n'ai eu aucun problème avec ça.

(function(factory){ 
    // Support module loading scenarios 
    if (typeof define === 'function' && define.amd){ 
    // AMD Anonymous Module 
    define(['jquery'], factory); 
    } else { 
    // No module loader (plain <script> tag) - put directly in global namespace 
    jQuery.sammy = window.Sammy = factory(jQuery); 
    } 
})(function($){ 

Voici un exemple de l'utiliser

define(["jquery", "../sammy-0.7.5.min"], function ($, Sammy) { 


Sammy('#main', function() { 

     // define a 'get' route that will be triggered at '#/path' 
     this.get('#/path', function() { 
      // this context is a Sammy.EventContext 
      this.$element() // $('#main') 
       .html('A new route!'); 
     }); 
     }).run(); 

} 
Questions connexes