将参数传递给Require.js模块

时间:2013-06-29 16:23:45

标签: asp.net-mvc-4 requirejs

我有一个页面需要抓取id并将它们传递给require.js模块。

所以指向页面的链接是这样的: www.website.com/SomeController/SomeAction/Id

此页面当前调用require.js,如下所示:

<script data-main="../Scripts/app/administrator/app.index" src="../Scripts/lib/require.js"></script>

app.index.js具有以下代码:

requirejs.config({
    "baseUrl": "../Scripts/app/administrator",
    "paths": {
        "app.index": "app.index",
        "ko": "../../lib/knockout-2.2.1",
        'knockout.bindings': "../../lib/knockout.bindings",
        "jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min",
        "toastr": "../../lib/toastr",
        "model.navigation" : "../models/model.navigation"
}
});

// Load the main app module to start the app
require(["main.index"], function (bs) { bs.run(); });

并且main.index.js具有以下代码:

define(['ko', 'indexViewModel', 'model.navigation'], function (ko, indexViewModel, Navigation) {
    var
        run = function () {
            var vm = new indexViewModel();

            var array = new Array();
            $.getJSON("/api/navigations/getmynavigation/", function (data) {
                $.each(data, function (key, val) {
                    var n = new Navigation();
                    n.navigationId(val.NavigationId);
                    n.name(val.Name);
                    array.push(n);
                });
            }).done(function(){
                vm.navigations(array);
            });

            ko.applyBindings(vm, document.getElementById('#administrator-home-view'));
        };
    return {
        run: run
    };
});

我感到困惑的是,如果我想将参数传递给此模块,我该怎么做?

参数的来源可能来自:

  1. 主播:<a href="/administrator/user/3>Bob</a>
  2. 服务器端:返回视图(3)
  3. 无论哪种方式在require.js中完成?

2 个答案:

答案 0 :(得分:9)

我允许你的模块接受一个参数,然后从require回调中传递它。类似的东西:

<强> module.js

define(['depA', 'depB'], function(depA, depB) {
    return {
        foo: function(param) {
            // Do something with param
        }
    }
});

<强> main.js

require(['module'], function(module) {
    module.foo('myparam')
});

如果您愿意,也可以通过附加要求中的事件从链接中获取它:

require(['module'], function(module) {
    document.querySelector('.link').addEventListener(function(event) {
        module.foo(this.href);
        event.preventDefault();
    });
});

答案 1 :(得分:1)

如果您需要更像构造函数的初始化阶段,则可以执行以下操作:

的engine.js

define('engine', [], function() {
    return function(param) {
        return {
            getParam: function() { return param; }
        }
    }
};

home.js

require('engine', function(engine) {
    var eng = engine('myparam')
    console.log(eng.getParam()); // should return 'myparam'
});

这里的不同之处在于&#39;引擎&#39;返回一个函数,而不是一个对象,所以你必须记住调用&#39; eng&#39;作为参数的函数。