Javascript 在Durandal中实现Sidr

我正在努力让这辆车在杜兰达尔工作。这是我的

Main.js

requirejs.config({
paths: {
    'text': '../lib/require/text',
    'async': '../lib/require/async',
    'durandal': '../lib/durandal/js',
    'plugins': '../lib/durandal/js/plugins',
    'transitions': '../lib/durandal/js/transitions',
    'knockout': '../lib/knockout/knockout-2.3.0',
    'bootstrap': '../lib/bootstrap/js/bootstrap',
    'sidr': '../lib/sidr/jquery.sidr.min',
    'jquery': '../lib/jquery/jquery-1.9.1'
},
shim: {
    'bootstrap': {
        deps: ['jquery'],
        exports: 'jQuery'
    },
    'sidr': {
        deps: ['jquery']
    }

  }
});

define(['plugins/router', 'durandal/app', 'sidr'], function (router, app, sidr) {

return {
  router:router,
  activate:{...},
    compositionComplete: function (view, parent) {
            $('#simple-menu').sidr();

       return true;
    }
 }

Shell.js

requirejs.config({
paths: {
    'text': '../lib/require/text',
    'async': '../lib/require/async',
    'durandal': '../lib/durandal/js',
    'plugins': '../lib/durandal/js/plugins',
    'transitions': '../lib/durandal/js/transitions',
    'knockout': '../lib/knockout/knockout-2.3.0',
    'bootstrap': '../lib/bootstrap/js/bootstrap',
    'sidr': '../lib/sidr/jquery.sidr.min',
    'jquery': '../lib/jquery/jquery-1.9.1'
},
shim: {
    'bootstrap': {
        deps: ['jquery'],
        exports: 'jQuery'
    },
    'sidr': {
        deps: ['jquery']
    }

  }
});

define(['plugins/router', 'durandal/app', 'sidr'], function (router, app, sidr) {

return {
  router:router,
  activate:{...},
    compositionComplete: function (view, parent) {
            $('#simple-menu').sidr();

       return true;
    }
 }

Shell.html

<div data-bind="compose: { view: 'nav' }"></div>

<div id="wrap" class="container">
   <div class="navbar navbar-fixed-top">
        <div class="navbar-inner">

            <div class="menuicon pull-left">
                <a id="simple-menu" href="">
                    <img alt="#" src="images/menu.png" /></a>
            </div>
     </div>
   </div>

<nav>
...
</nav>

nav.html

<div data-bind="compose: { view: 'nav' }"></div>

<div id="wrap" class="container">
   <div class="navbar navbar-fixed-top">
        <div class="navbar-inner">

            <div class="menuicon pull-left">
                <a id="simple-menu" href="">
                    <img alt="#" src="images/menu.png" /></a>
            </div>
     </div>
   </div>

<nav>
...
</nav>

...

---

简单地总结一下我的问题…它不起作用！当我点击菜单按钮时，什么也没发生。我需要做什么不同的事情？

如果是菜单，我认为您需要命名nav元素：

<nav id="sidr">
...
</nav>

...

Hmmm…很有意思，我一定会试试这个…虽然我在这个项目中使用了其他东西，但谢谢