0

我想知道执行此任务的正确方法，我有一个 JSON 文件，其中包含从 A 到 Z 的字母。我想在我的应用程序中加载该文件，并将加载的数据分配给一个名为“alphabets”的数组模型称为“dObj”，然后使用 {{#each}} 循环显示数组的所有元素。

我不确定如何将数据绑定到模型。在 ArrayController 的 pushObject() 方法中，我传递了 create() 方法，而我不仅应该创建对象，还应该将加载数据推送到模型中的数组。

我感谢您的所有帮助。谢谢你。

这是小提琴：http: //jsfiddle.net/exciter/Y3dcs/

代码：

    $function(){

        App = Ember.Application.create();

        App.dObj = Ember.Object.extend({
            alphabets: []
        });

        App.DObjController = Ember.ArrayController.create({
            content: [],
            loadAlphabets: function(){
                var self = this;
                $.getJSON('data/alphabets.json', function(data){
                    data.forEach(function(item){
                        self.pushObject(App.dObj.create(item));
                    });
                });
            }
        });
        App.initialize();
    });

文件

{
    'alphabets' : [
                    'A','B''C','D','E','F','G',
                    'H','I','J','K','L','M','N',
                    'O','P','Q','R','S','T','U',
                    'V','W','X','Y','Z'
                    ]
}

HTML

<script type="text/x-handlebars">
    {{#view Ember.Button target="App.DObjController" action="loadAlphabets"}}
       Load Alphabets
    {{/view}}

    {{#each App.DObjController}}
        {{alphabets}}                          
    {{/each}}
</script>
4

1 回答 1

1

您要做的是dObj为您的 ajax 调用返回的每个字母创建一个新的，然后将这些对象推送到DObjControllerArrayController 中。

然后，要显示这个对象数组，您需要使用{{#each letterObj in App.DObjController}}模板助手命令循环遍历每个dObj包含您的字母数据的实例并输出存储的字母数据。

JSFiddle 示例

模板：

<script type="text/x-handlebars">
    {{#view Ember.Button target="App.DObjController" action="loadAlphabets"}}
       Load Alphabets
    {{/view}}

    {{#each letterObj in App.DObjController}}
        {{letterObj.letter}}                          
    {{/each}}
</script>

JS：

$(function(){

    App = Ember.Application.create({
        ready: function(){
            alert('APP INIT');
}
    });

    App.dObj = Ember.Object.extend({
    });

    App.DObjController = Ember.ArrayController.create({
        content: [],
        loadAlphabets: function(){
            var self = this;
            //$.getJSON('data/alphabets.json', function(data){
            //    data.forEach(function(item){
            //        self.pushObject(App.dObj.create(item));
            //    });
            //});

            setTimeout(function() {
                var alphabets = [
                    "A","B","C","D","E","F","G",
                    "H","I","J","K","L","M","N",
                    "O","P","Q","R","S","T","U",
                    "V","W","X","Y","Z"
                    ];
                alphabets.forEach(function(item){
                    self.pushObject(App.dObj.create({letter:item}));
                });
            },1000);
        }
    });
    App.initialize();
});​
于 2013-01-03T17:22:15.887 回答