如何从模型通知视图以更改主干中的值答案

【问题标题】：How to notify view from model to change a value in backbone如何从模型通知视图以更改主干中的值
【发布时间】：2013-07-19 07:16:17
【问题描述】：

我有一个模型，例如：

var resultEntityModel = Backbone.RelationalModel.extend({
        defaults : {
            name : "",
            bgOccurence : "",
            fgOccurence : "",
            bgOccurenceCount : "",
            fgOccurenceCount : "",
        },
        initialize : function() {

            var bgOccurence = this.set("bgOccurence", bgOccurence);      
            var fgOccurence = this.set("fgOccurence", fgOccurence);
            if((Math.abs((bgOccurence-fgOccurence))) >= 10){        
                // send information to view that background should be red
            }else{
                // send information to view that background should be white
            }
        },
});

还有一个观点：

var resultEntityView = Marionette.CompositeView.extend({
        tagName : "tr",
        template : ResultEntityPanel,
        initialize: function () {
               this.model.on(...) // it should take information from model 
                                  //and change css values according to this information
        },

    });

如何从模型中获取信息并将其发送到视图以更改 .css 文件中的某些值？我知道方法，但我不知道怎么做。

【问题讨论】：

this.model.on('change', function() { console.log("hidyho"); }); - 但是至于更改 .css 文件将是不行的，但是您可以使用 jQuery 更改某些内容的 CSS。

标签： javascript jquery html css backbone.js

【解决方案1】：

您希望视图监听模型的变化。见Backbone listenTo。

未经测试的代码，但应该这样做：

型号：

    var resultEntityModel = Backbone.RelationalModel.extend({
        defaults : {
            name : "",
            bgOccurence : "",
            fgOccurence : "",
            bgOccurenceCount : "",
            fgOccurenceCount : "",
        },
        initialize : function() {
            this.set("bgOccurence", bgOccurence);      
            this.set("fgOccurence", fgOccurence);
        }
    });

查看：

    var resultEntityView = Marionette.CompositeView.extend({
        tagName : "tr",
        template : ResultEntityPanel,
        initialize: function () {
            this.listenTo(this.model, "change:bgOccurence", this.setBg);
            this.listenTo(this.model, "change:fgOccurence", this.setBg);
        },
        setBg: function(model, value) {
            var bgOccurence = model.get('bgOccurence'),
                fgOccurence = model.get('fgOccurence');
            if ((Math.abs((bgOccurence-fgOccurence))) >= 10) {
                $('body').css({'background-color':'red'})
            } else {
                $('body').css({'background-color':'white'})
            }
        }
    });

【讨论】：