如何在包含json的html中包含.js文件？

我需要显示一个javascript类的实例，该实例使用require.js在骨干中加载了来自.json文件的数据。如何在包含json的html中包含.js文件？

我有以下js和JSON文件：

收藏/ Companies.js

define([ 
    'models/Company' 
], function(CompanyModel) { 
    'use strict'; 

    var CompanyCollection = Backbone.Collection.extend({ 
     model: CompanyModel 
    }); 

    return CompanyCollection; 
});

数据/ companies.json

[{ 
    "id": 1000001, 
    "name": "Test Company 1", 
    "description": "this is a test company that should be displayed" 
}, 
{ 
    "id": 1000002, 
    "name": "Test Company 2", 
    "description": "this is another test company that should be displayed as well" 
}]

另外，我有下面的代码片段：

<script type="text/javascript" data-main="data/companies.json" src="collections/Companies.js"></script> 
    <script type="text/javascript"> 
     require(["collections/Companies"], 
     function(Companies){ 
      $("#json").append(Companies[0].id); 
      alert("test"); 
     } 
     ); 
    </script> 

    <div id="json"></div>

当然，它不按我的意图工作，我无法弄清楚正确的语法和/或迭代逻辑。如何使用.json文件中的数据加载.js类？我的<script type="text/javascript" data-main...行似乎不起作用。

如果我不够清楚，请提前致谢。

来源

2014-02-15 xanyi

requirejs通常用于加载脚本和模板文件，但您也可以使用它加载.json文件。但你必须使用JSON.parse来解析它。

你有2个不同的选项，

使用requirejs text plugin，如：

require(["collections/Companies", "text!data/companies.json"], 
    function(Companies, CompaniesJSONStr) { 
     var CompaniesJSON = JSON.parse(CompaniesJSONStr); 

    } 
);

或使用requirejs plugins，它再次使用text!插件：

require.config({ 
    paths : { 
     json: 'data' 
    } 
}); 

define([ 'collections/Companies', 'json!companies.json' ], 
    function(Companies, CompaniesJSON){ 

    } 
);

来源

2014-02-15 14:36:38

我如何加载JSON文件进入课堂？ – xanyi

@xanyi：尝试这两种方式，他们应该工作。 –

谢谢，它现在正在工作。 – xanyi

如何在包含json的html中包含.js文件？

回答

相关问题