Backbone.js綁定動態EL生成

Question

我在創建視圖並動態創建“ el”元素並將其傳遞給正在創建的視圖時遇到了一個小問題。

var divIdentification = ".data-identification-"+this.model.dataTypeId+"-"+this.model.dataGrouping.get("data1Id")+"-"+this.model.dataGrouping.get("data2Id");

以下工作

var roomOccupancyView = new Bookings.RoomOccupancyView({
                    model: datas,
                    el: "div"
                });

但是以下內容沒有

var divIdentification = ".data-identification-"+this.model.dataTypeId+"-"+this.model.dataGrouping.get("data1Id")+"-"+this.model.dataGrouping.get("data2Id");

    var roomOccupancyView = new Bookings.RoomOccupancyView({
                        model: datas,
                        el: divIdentification 
                    });

當我嘗試在第一個方案中將el作為字符串傳遞的第一種情況在子視圖中放置el的console.log時，得到以下對象

<div class="header-container">

但是，當我傳遞變量時，會得到“未定義”。

另外，我還嘗試將變量輸出包裝為$（string），但是由於console.log仍然提供了不同的輸出，因此也沒有用。

沒有人有任何想法將動態值傳遞給el屬性值。 任何幫助是極大的贊賞。

此致MilindaD

Answer 1

正如評論所指出的那樣，通過初始化函數傳遞的el屬性只能是String或jQuery對象。 否則，Backbone將根據其tagName ， className和id屬性創建一個el。

因此，在您的第一個場景中，您傳遞了el: "div" ，然后Backbone將視圖的el綁定到DOM中的第一個div元素。

在第二種情況下，您通過了el: divIdentification和Backbone會將視圖的el設置為$（divIdentification），這在您的DOM中未定義。

為了讓您動態設置el 。 3種方法

1. 在初始化程序中為el值分配一個有效的html字符串，選擇器字符串或一個有效的jQuery DOM對象。

2. 在初始化程序中將className或id屬性分配給divIdentification，以允許Backbone視圖創建自己的el

3. 另一種方法是在這里使用setElement

Answer 2

您的問題是您在創建divIdentification關鍵字this時未指向您的視圖，請嘗試以下操作：

var roomOccupancyView = new Bookings.RoomOccupancyView({
                    model: datas,
                    el: function() {
                    return ".data-identification-" + 
                        this.model.dataTypeId + 
                        "-" + this.model.dataGrouping.get("data1Id") +
                        "-"+this.model.dataGrouping.get("data2Id");
                    } 
                });