Question

我正在使用模型使用POST从服务中获取位置数据。然而，当我最终收到回复时，我正在努力争取听取该模型的观点。

注意我已经覆盖了一些模型方法以适应我正在使用的服务。

型号代码

        define([
        'underscore',
        'backbone',
    ], function (_, Backbone)
    {
        'use strict';

        //model class declaration
        var LocationsModel = Backbone.Model.extend({

            locations: null, //this attribute stores the json response


            //url for http post to get location data
            url: '/testserver/getLocationData',

            /**
                 @name constructor
                 @method initialise
            **/
            initialize: function ()
            {
                console.log("Location Model - Initialize");
                this.fetchLocationData();  
            },

            /**
                @name fetchLocationData
                @method fetchLocationData
                @summary retrieves bulding/location data from service, overriden fetch function to use POST
            **/
            fetchLocationData: function ()
            {
                console.log("Location Model - Fetching Building/Location data from EAS");

                this.fetch({
                    data: JSON.stringify({ "lastRefreshedDateTime": "2015-04-01T08:18:06.000+00:00", "uid": "" }),  //refactor this - string literals which are static currently
                    type: "POST",
                    contentType: "application/json",
                    async : false, //this is bad but it is the only way I can get it to work

 at the moment
                reset: true //tried adding reset parameter but no luck
            });
        },

        /**
           @name parse
           @method parse
           @summary parse is a method inside backbone that can be overridden, in this override we set a model attribute to the JSOn response
       **/
        parse: function (response, xhr)
        {
            console.log("Location Model - Parsing response from EAS");
            this.attributes = { "true": true }; //tried adding an attribute value to trigger "change:true"
            this.locations = response;
            //do other stuff
        },


    });

        return LocationsModel;

    });

在视图初始化程序中，我尝试了以下绑定并听取模型但是在响应后它们似乎没有触发。

查看代码

model : new LocationModel(),

        initialize: function ()
    {
        console.log("Filter View - Initialize");
        this.render();
        this.listenTo(this.model, 'change', this.render); //this only fires at the start when the model is initialised
        this.model.on('change', this.render, this); //same as above
        this.listenTo(this.model, 'reset', this.render); //not fired at all
    },

对于一个集合来说，听听发生的任何变化都相当简单，但对于Backbone模型来说它似乎是一个不同的球类游戏。

TLDR，如何让视图听取模型成功获取请求？

Answer 1

sync事件是您要listenTo的事件。 fetch成功完成后会被触发。 Backbone源代码中的这一行是罪魁祸首：Backbone source, line 578。

您的代码现在看起来应该是这样的：

查看代码

model : new LocationModel(),

    initialize: function ()
{
    console.log("Filter View - Initialize");
    this.render();
    this.listenTo(this.model, "sync", this.render);
},

这里有fiddle，显示您的代码正常运行。我使用httpbin来模拟POST请求。您现在也可以删除获取请求中的async: false参数:)（我已经在小提琴示例中将其删除了。）

骨干视图听模型，没有触发更改或重置？

1 个答案: