在一个文件中定义多个html amd模块

时间:2014-02-17 18:30:26

标签: html text module requirejs

有没有办法在文本文档中定义requirejs?还是一个HTML文档?

我的文档中填充了网格的标题和单元格模板

<body>
    <th data-fieldname="PatientPerson">Name <span data-bind="attr: { class: sortField() == 'PatientPerson' ? 'inline-block' : 'hide' }"></span></th>
    <td><span class="glyphicon glyphicon-expand"></span><a data-bind="click: function () { $parent.loadReportSummary(PatientPerson.ID()) }"><span data-bind="text: PatientPerson.FullName"></span></a></td>

    <th data-fieldname="StudyType">Study Type <span data-bind="attr: { class: sortField() == 'StudyType' ? 'inline-block' : 'hide' }"></span></th>
    <td data-bind="text: StudyType"></td>


    <th data-fieldname="ServiceDate">Service Date<span data-bind="attr: { class: sortField() == 'ServiceDate' ? 'inline-block' : 'hide' }"></span></th>
    <td data-bind="text: ServiceDate"></td>


    <th>Export Summary</th>
    <td><a data-bind="click: function (data) { $parent.exportReportSummary(data, PatientPerson.ID, SummaryID, !StudyExported()) }">View</a></td>


    <th>Print All Reports</th>
    <td><a data-bind="click: function (data) { $parent.printAllReports('/PrintReports/Reports?summaryID=' + SummaryID) }">Print</a></td>

etc.......
</body>

在另一个模块中,我有一个数组,用于确定在挖空计算的observable中使用了哪些列。我希望我可以将这些模块中的每一个都变成一个模块,而不是使用jquery解析它们,但我希望它们都在一个文件中。我正在使用requirejs的文本插件,但似乎没有办法将每个这些插件声明为一个文件中的模块,并且将每个文件拆分为单独的文件似乎很浪费。

可能像

<!--export name:"PatientPerson" -->
    <th data-fieldname="PatientPerson">Name <span data-bind="attr: { class: sortField() == 'PatientPerson' ? 'inline-block' : 'hide' }"></span></th>
    <td><span class="glyphicon glyphicon-expand"></span><a data-bind="click: function () { $parent.loadReportSummary(PatientPerson.ID()) }"><span data-bind="text: PatientPerson.FullName"></span></a></td>
<!-- /export-->

然后引用模块

require('filename').PatientPerson;

1 个答案:

答案 0 :(得分:0)

我创建了一个插件,你可以在某个文件的需要末尾添加一个!define,它将使OP工作中的spec建议。它适用于requirejs的官方文本插件。

define(['text', 'module'], function (text, module) {
    var exportRegExp = /<!--\s*?export[^>]*>([\s\S]*?)<!--\s*?\/export\s*?-->/g,
    masterConfig = (module.config && module.config()) || {},
    buildMap={};
    text.export = function (content) {
        var exports = null;
        if (content) {
            var matches = content.match(exportRegExp) || [],
                match, _i, _len;
            exports = matches.length ? {} : null;
            for (_i = 0, _len = matches.length; _i < _len; _i++) {
                match = matches[_i];
                var exportName = match.match(/(<!--\s*?export\s*?name\:")(.*?)\"\s*?-->/).slice(-1)[0];
                exports[exportName] = match.replace(/<!--\s*?export[^>]*>\n?/, '').replace(/<!--\s*?\/export\s*?-->/, '');
            }
        }
        return exports;
    };
    var baseParseName = text.parseName;
    text.parseName = function(name) {
        var index, parseExport = false;
        index = name.indexOf('!export');
        if (index !== -1) {
            parseExport = true;
            name.split('!export').join('');
        }
        var out = baseParseName(name);
        out["strip"] = { "export": parseExport, "strip": out["strip"] };
        return out;
    };

    text.finishLoad = function (name, strip, content, onLoad) {
        var exports = strip.export ? text.export(content,name) : content;
        if (exports == null) content = strip.strip ? text.strip(content) : content;
        else content = exports;
        if (masterConfig.isBuild) {
            buildMap[name] = content;
        }
        onLoad(content);
    };
    text.write = function (pluginName, moduleName, write, config) {
        if (buildMap.hasOwnProperty(moduleName)) {
            var content = text.jsEscape(buildMap[moduleName]);
            write.asModule(pluginName + "!" + moduleName,
                           "define(function () { return '" +
                               content +
                           "';});\n");
        }
    };
});

以下内容可行

require([text!somefile!define],function(){})

这也有效但如果文件中存在任何导出,它会忽略!strip命令。

require([text!somefile!strip!define],function(){})

然后你可以打电话

require(['someModuleNameInDefineComment'],function(){})

我没有在标题中使用开头定义处理strip。

Here is a Gist