Parsing backbone.js将文本文件加载到集合中_Parsing_Backbone.js_Text Files_Loading

Parsing backbone.js将文本文件加载到集合中

parsing backbone.js

Parsing backbone.js将文本文件加载到集合中,parsing,backbone.js,text-files,loading,Parsing,Backbone.js,Text Files,Loading,这是我第一次使用开发框架，并坚持第一步我正在将Flex应用程序转换为Javascript应用程序，并使用主干作为框架我必须加载一个名值格式的文本文件 <!doctype html> <html> <head> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script> <script src='http://c

这是我第一次使用开发框架，并坚持第一步

我正在将Flex应用程序转换为Javascript应用程序，并使用主干作为框架

我必须加载一个名值格式的文本文件

<!doctype html>
<html>
<head>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.10/backbone-min.js'></script>
<script>
var ResourceBundleCollection = Backbone.Collection.extend({
url:'ResourceBundle.txt',
});
var resourceBundleCollection = new ResourceBundleCollection();
resourceBundleCollection.fetch();
</script>
</head>
<body>
</body>
</html>

它抛出以下错误格式不好

我可以使用JQuery轻松地加载文本文件并对其进行解析

$.ajax({
type : "GET",
url : "ResourceBundle.txt",
datatype : "script",
success : resourceXMLLoaded
});

并使用以下代码对其进行解析

var lines = txt.split("\n");
for(var i=0;i<lines.length;i++) {
if(lines[i].length > 5) {
var _arr = lines[i].split("=");
resourceBundleObj[$.trim(_arr[0])] = $.trim(_arr[1]);
}
}

var lines=txt.split（“\n”）；
对于（变量i=0；变量i=5）{
var_arr=行[i]。拆分（“=”）；
resourceBundleObj[$.trim（_arr[0]）]=$.trim（_arr[1]）；
}
}

请建议如何在backbone.js中获得相同的结果。默认情况下，backbone中的集合只接受JSON格式的集合。因此，您需要将输入转换为JSON格式：

[{"name": "name", "value": "value},
 {"name": "name", "value": "value}, ...
]

当然，您可以覆盖默认行为：

默认情况下，主干网中的集合只接受JSON格式的集合。因此，您需要将输入转换为JSON格式：

[{"name": "name", "value": "value},
 {"name": "name", "value": "value}, ...
]

当然，您可以覆盖默认行为：

如果必须使用纯文本来支持此操作，则可以覆盖

主干.Collection.parse

以实现所需功能

除此之外，您可能还希望创建一个

ResourceBundleModel

，以承载

ResourceBundleCollection

中的每个项目

您可以在此处看到演示：

模型和集合的代码如下所示：

// Define a Backbone.Model that host each ResourceBundle
var ResourceBundleModel = Backbone.Model.extend({
    defaults: function() {
        return {
            name: null,
            value: null
        };
    }
});

// Define a collection of ResourceBundleModels.
var ResourceBundleCollection = Backbone.Collection.extend({
    // Each collection should know what Model it works with, though
    // not mandated, I guess this is best practice.
    model: ResourceBundleModel,

    // Replace this with your URL - This is just so we can demo
    // this in JSFiddle.
    url: '/echo/html/',

    parse: function(resp) {
        // Once AJAX is completed, Backbone will call this function
        // as a part of 'reset' to get a list of models based on
        // XHR response.
        var data = [];
        var lines = resp.split("\n");

        // I am just reusing your parsing logic here. :)
        for (var i=0; i<lines.length; i++) {
            if (lines[i].length > 5) {
                var _arr = lines[i].split("=");

                // Instead of putting this into collection directly,
                // we will create new ResourceBundleModel to contain
                // the data.
                data.push(new ResourceBundleModel({
                    name: $.trim(_arr[0]),
                    value: $.trim(_arr[1])
                }));
            }    
        }

        // Now, you've an array of ResourceBundleModel. This set of
        // data will be used to construct ResourceBundleCollection.
        return data;
    },

    // Override .sync so we can demo the feature on JSFiddle
    sync: function(method, model, options) {
        // When you do a .fetch, method is 'read'
        if (method === 'read') {
            var me = this;

            // Make an XHR request to get data
            // Replace this code with your own code
            Backbone.ajax({
                url: this.url,
                method: 'POST',
                data: {
                    // Feed mock data into JSFiddle's mock XHR response
                    html: $('#mockData').text()
                },
                success: function(resp) {
                    options.success(me, resp, options);
                },
                error: function() {
                    if (options.error) {
                        options.error();
                    }
                }
            });
        }
        else {
            // Call the default sync method for other sync method
            Backbone.Collection.prototype.sync.apply(this, arguments);
        }
    }
});

//定义承载每个ResourceBundle的主干.Model
var ResourceBundleModel=Backbone.Model.extend({
默认值：函数（）{
返回{
名称：空，
值：null
};
}
});
//定义ResourceBundleModel的集合。
var ResourceBundleCollection=Backbone.Collection.extend({
//不过，每个集合都应该知道它使用的是什么模型
//不是强制性的，我想这是最好的做法。
型号：ResourceBundleModel，
//将此替换为您的URL-这只是为了让我们可以演示
//这是在JSFiddle中。
url:“/echo/html/”，
解析：函数（resp）{
//一旦AJAX完成，主干将调用此函数
//作为“重置”的一部分，以获取基于
//XHR响应。
var数据=[]；
变量行=分别拆分（“\n”）；
//我只是在这里重复使用您的解析逻辑。：）
对于（变量i=0；变量i=5）{
var_arr=行[i]。拆分（“=”）；
//而不是直接将其放入集合中，
//我们将创建新的ResourceBundleModel以包含
//数据。
data.push（新的ResourceBundleModel({
名称：$.trim（_arr[0]），
值：$.trim（_arr[1]）
}));
}    
}
//现在，您有了一个ResourceBundleModel数组
//数据将用于构造ResourceBundleCollection。
返回数据；
},
//这样我们就可以在JSFIDLE上演示该功能了
同步：功能（方法、模型、选项）{
//执行.fetch时，方法为“read”
如果（方法=='read'）{
var me=这个；
//发出XHR请求以获取数据
//用您自己的代码替换此代码
Backbone.ajax({
url:this.url，
方法：“POST”，
数据：{
//将模拟数据馈送到JSFIDLE的模拟XHR响应中
html:$（'#mockData'）.text（）
},
成功：功能（resp）{
选项。成功（me、resp、选项）；
},
错误：函数（）{
if（options.error）{
options.error（）；
}
}
});
}
否则{
//调用其他同步方法的默认同步方法
Backbone.Collection.prototype.sync.apply（这是参数）；
}
}
});

主干网被设计为通过JSON本地与RESTful API一起工作。但是，如果有足够的自定义，它是一个足够灵活的库，可以满足您的需要。

如果您必须使用纯文本来支持此功能，则可以重写主干.Collection.parse，以实现您所需的功能

除此之外，您可能还希望创建一个

ResourceBundleModel

，以承载

ResourceBundleCollection

中的每个项目

您可以在此处看到演示：

模型和集合的代码如下所示：

// Define a Backbone.Model that host each ResourceBundle
var ResourceBundleModel = Backbone.Model.extend({
    defaults: function() {
        return {
            name: null,
            value: null
        };
    }
});

// Define a collection of ResourceBundleModels.
var ResourceBundleCollection = Backbone.Collection.extend({
    // Each collection should know what Model it works with, though
    // not mandated, I guess this is best practice.
    model: ResourceBundleModel,

    // Replace this with your URL - This is just so we can demo
    // this in JSFiddle.
    url: '/echo/html/',

    parse: function(resp) {
        // Once AJAX is completed, Backbone will call this function
        // as a part of 'reset' to get a list of models based on
        // XHR response.
        var data = [];
        var lines = resp.split("\n");

        // I am just reusing your parsing logic here. :)
        for (var i=0; i<lines.length; i++) {
            if (lines[i].length > 5) {
                var _arr = lines[i].split("=");

                // Instead of putting this into collection directly,
                // we will create new ResourceBundleModel to contain
                // the data.
                data.push(new ResourceBundleModel({
                    name: $.trim(_arr[0]),
                    value: $.trim(_arr[1])
                }));
            }    
        }

        // Now, you've an array of ResourceBundleModel. This set of
        // data will be used to construct ResourceBundleCollection.
        return data;
    },

    // Override .sync so we can demo the feature on JSFiddle
    sync: function(method, model, options) {
        // When you do a .fetch, method is 'read'
        if (method === 'read') {
            var me = this;

            // Make an XHR request to get data
            // Replace this code with your own code
            Backbone.ajax({
                url: this.url,
                method: 'POST',
                data: {
                    // Feed mock data into JSFiddle's mock XHR response
                    html: $('#mockData').text()
                },
                success: function(resp) {
                    options.success(me, resp, options);
                },
                error: function() {
                    if (options.error) {
                        options.error();
                    }
                }
            });
        }
        else {
            // Call the default sync method for other sync method
            Backbone.Collection.prototype.sync.apply(this, arguments);
        }
    }
});

//定义承载每个ResourceBundle的主干.Model
var ResourceBundleModel=Backbone.Model.extend({
默认值：函数（）{
返回{
名称：空，
值：null
};
}
});
//定义ResourceBundleModel的集合。
var ResourceBundleCollection=Backbone.Collection.extend({
//不过，每个集合都应该知道它使用的是什么模型
//不是强制性的，我想这是最好的做法。
型号：ResourceBundleModel，
//将此替换为您的URL-这只是为了让我们可以演示
//这是在JSFiddle中。
url:“/echo/html/”，
解析：函数（resp）{
//一旦AJAX完成，主干将调用此函数
//作为“重置”的一部分，以获取基于
//XHR响应。
var数据=[]；
变量行=分别拆分（“\n”）；
//我只是在这里重复使用您的解析逻辑。：）
对于（变量i=0；变量i=5）{
var_arr=行[i]。拆分（“=”）；
//而不是直接将其放入集合中，
//我们将创建新的ResourceBundleModel以包含
//数据。
data.push（新的ResourceBundleModel({
名称：$.trim（_arr[0]），
值：$.trim（_arr[1]）
}));
}    
}
//现在，您有了一个ResourceBundleModel数组
//数据将用于构建ResourceBundleColl