Question

在导航栏的shell中，我必须调用javascript函数（外部模块），但仅限于合成完成时。

这是我的代码：

shell.js

define(['plugins/router', 'durandal/app', 'charms'], function (router, app, ch) {
  return {
    router: router,
    activate: function () {
        router.map([
            { route: '', title:'Welcome', moduleId: 'viewmodels/welcome', nav: true },
            { route: 'Gallery', moduleId: 'viewmodels/gallery', nav: true }
        ]).buildNavigationModel();

        return router.activate();
    }
  };
});

我试图使用附加/ compositionComplete回调，但模块始终是调用。

有什么想法吗？感谢

Answer 1

除了布雷特的回答。如果charms是一个有效的AMD模块，但它在加载时立即执行，那么你不应该将它声明为依赖项。而是在需要时require。为此，请将require语法更改为commonjs style http://requirejs.org/docs/whyamd.html#sugar。

define(function (require) {
  var router = require('plugins/router'),
      app = require('durandal/app')        

  return {
    router: router,
    activate: function () {
        router.map([
            { route: '', title:'Welcome', moduleId: 'viewmodels/welcome', nav: true },
            { route: 'Gallery', moduleId: 'viewmodels/gallery', nav: true }
        ]).buildNavigationModel();

        return router.activate();
    },
    attached: function(){ // or compositionComplete whatever suits better
        require('charms');
    }
  };
});

请注意根据您的上述说明，此charms会在加载时立即执行，但AMD模块仅在应用程序的生命周期内评估一次。因此，您可能希望从init返回类似run或charms函数的内容，以便可以多次执行。

假设魅力

define(function (require) {
  function init(){
      //do whatever charms is doing
  }

  return {
    init: init
  };
});

这样你就不必切换到commonjs风格，可以简单地调用

attached: function(){ // or compositionComplete
    ch.init()
}

Answer 2

首先，您尚未向返回的viewmodel提供compositionComplete()或attached()方法。 Durandal在您的viewmodel上执行这些功能，如果它们存在。你可以在这里阅读：http://durandaljs.com/documentation/Hooking-Lifecycle-Callbacks/。所以，添加它们，如下所示：

define(['plugins/router', 'durandal/app', 'charms'], function (router, app, ch) {
  return {
    router: router,
    activate: function () {
        // this is called when the shell module is activated (always called FIRST)
        router.map([
            { route: '', title:'Welcome', moduleId: 'viewmodels/welcome', nav: true },
            { route: 'Gallery', moduleId: 'viewmodels/gallery', nav: true }
        ]).buildNavigationModel();

        return router.activate();
    },
    attached: function() {
        // this is called when the shell view is attached to the DOM
    },
    compositionComplete: function () {
        // this is called when the shell view composition is complete
    }
  };
});

如果'charms'模块中的代码在任何激活方法之前执行，可能是因为它不是用于与RequireJS一起使用的模块化模式。您必须使用define()包装模块才能使它们按预期工作。

Durandal / Require：模块加载和执行

2 个答案:

假设魅力