Question

我在控制台中收到以下错误消息：

http://localhost/web/js/text.js
404 Not Found

如果删除文字！在“text！templates / collector / indexTemplate.html”表单collector_index.js中，我收到以下错误消息：

http://localhost/web/js/templates/collector/indexTemplate.html.js
404 Not Found

main.js

require.config({
    paths: {
        html5shiv: "libs/html5shiv",
        jquery: "http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min",
        jqueryui: "http://code.jquery.com/ui/1.10.3/jquery-ui",
        tablesorter: "libs/jquery.tablesorter.min",
        script: "script",
        underscore: "libs/underscore.min", /*"http://underscorejs.org/underscore",*/
        backbone: "libs/backbone.min", /*"http://backbonejs.org/backbone-min",*/
        utils: "utils",
//       Collector
        collectorModel: "models/collectorModel",
        collectorCollection: "collectorCollection",
        collectorRouter: "collectorRouter",
        // Views
        index: "views/collector/collector_index",
        row: "views/collector/collector_row",
    },
    shim: {
        jqueryui: {
            deps: ["jquery"],
            exports: "Jqueryui"
        },
        tablesorter: {
            deps: ["jquery"],
            exports: "TableSorter"
        },
        script: {
            deps: ["jquery"],
            exports: "Script"
        },
        underscore: {
            exports: "_"
        },
        backbone: {
            deps: ["underscore", "jquery"],
            exports: "Backbone"
        }
    }

});

require(....

indexTemplate.html

<script type="text/template" id="indexTemplate">
    <table class="tables">
        <thead>
        <tr>
            <th>Name</th>
            <th>Role</th>
        </tr>
        </thead>
        <tbody></tbody>
    </table>
    <a class="btns" href="#collector/new">New Collector</a>
</script>

collector_index.js

define([
    "backbone",
    "underscore",
    "row",
    "text!templates/collector/indexTemplate.html"
], function (Backbone, _, CollectorRowView) {
    var CollectorIndexView = Backbone.View.extend({
        initialize: function (options) {
            this.collectors = options.collectors;
            this.collectors.bind('reset', this.addAll, this);
        },

        // populate the html to the dom
        render: function () {
            this.$el.html($('#indexTemplate').html());
            this.addAll();
            return this;
        },

        addAll: function () {
            // clear out the container each time you render index
            this.$el.find('tbody').children().remove();
            _.each(this.collectors.models, $.proxy(this, 'addOne'));
        },

        addOne: function (collector) {
            var view = new CollectorRowView({collectors: this.collectors, collector: collector});
            this.$el.find("tbody").append(view.render().el);
        }
    });
    return CollectorIndexView;
});

目录结构：

js
   views
     main.js
     ...
   templates
     collector
         indexTemplates.html
   main.js

感谢。

Answer 1

不确定这是否是拼写错误，但您的收藏夹文件夹中有 indexTemplates.html ，define()中有 indexTemplate.html 。

首先确保您在main.js所在的同一文件夹中使用text.js插件。在main.js：

中创建一个新条目

'templates': '../templates'

模板文件本身可以是没有.html扩展名的普通.js，您应该可以通过以下方式引用它：

var template = require("text!templates/collector/indexTemplate.html")

或define()如果你喜欢这样的话。

Backbone和requireJSe错误：加载模板时找不到404

1 个答案: