获取未捕获的TypeError:当我尝试在模板中显示数据时，Object #<Object>没有' Get‘方法

Question

我遇到了获取未捕获对象的问题:当我尝试在模板中显示数据时，TypeError#没有方法'get‘，以下是不同的主干部分：

模板：

<script type="text/template" id="class-template">


                <table class="table striped"></table>

                <thead>

                <tr>

                <th>Picture</th>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Role</th>
                <th>Email</th>


                </tr>

                </thead>

                <tbody>

                <% _.each(users,function(user){ %>

                <tr>
                <td><%= user.get('picUrl') %></td>
                <td><%= user.get('firstName') %></td>
                <td><%= user.get('lastLame') %></td>
                <td><%= user.get('role') %></td>
                <td><%= user.get('email') %></td>




                </tr>

                <% }); %>

                </tbody>
                  </table>

    </script>

数据模型和集合：

$.ajaxPrefilter(function(options, originalOptions, jqXHR) {

        options.url = 'http://localhost/' +options.url;

        });

        var Office = Backbone.Model.extend({

            defaults: {
                street : null,
                city : null,
                state : null, 
                country : null,
                postal_code : null,
            },
            initialize: function(){
                console.log("==> NEW LOCATION");

                // you can add event handlers here...


            }
        });
         var Person = Backbone.Model.extend({

            defaults: {
                picURL : null,
                firstName : null,
                lastName : null, 
                email : null,
                role : null,
                location : new Office()
            },
            initialize: function(){
                console.log("==> NEW PERSON MODEL");

                // you can add event handlers here...


            }
        });

        var Users = Backbone.Collection.extend({

        url:'loadData.php?list=16025,28477,28474,25513,16489,58911,04607',
        model:Person

        });

查看：

var ShowClass = Backbone.View.extend({

            el: '.page',
            initialize: function() {
                _.bindAll(this); //Make all methods in this class have `this` bound to this class
            },

            template: _.template($('#class-template').html()),

            render: function() {

                var users = new Users();

                console.log('calling fetch');

                users.fetch();

                users.on("reset", function(users){
                    console.log('rendering with data:'+users.models[0].get('firstName'));
                    this.$el.html(this.template({users:users.models}));
                    console.log('finished');
                }, this);

            }

            });

我能够看到从fetch调用返回的数据，所以我知道我正在获取数据。当我将它发送到模板时，它似乎都崩溃了。提前感谢您的帮助！

Answer 1

您应该只传递原始属性，而不是传递整个模型，而不是在脚本模板上执行get()。

我知道你也必须改变你的模板，但是以这种方式抽象你的模板，并在模板本身之外进行循环，会让你更好地处理你的错误。这也会使你的代码模块化，更容易调试。

查看：

users.on("reset", function(users){
    _.each(users, function (user) {
        var data = user.toJSON();
        this.$el.html(this.template({
                        picUrl: data.picUrl, 
                        firstName: data.firstName }));
    }, this);

模板将简单地为：

<td><%- picUrl %></td>
<td><%- firstName %></td>
...