ExtJS列渲染器

Question

我的問題是ExtJS 4中GridPanel中列的渲染器函數。渲染器的記錄應該從我的存儲中加載列表中的一個元素，並且它會執行;但它始終加載列表中的相同元素。

這裏是我的代碼的相關片段。

首先我的商店：

var nStore = Ext.create('Ext.data.Store', { 
    storeId: 'people', 
    fields: ['team', 'name', 'liste', 'sums'], 
    data: [{ 
     team: 'TestTeam', name: 'TestPerson', 
     liste: ['F', 'F', 'F', 'S', 'N', 'F', 'S', 
      'S', 'S', 'F', 'F', 'F', 'S', 'A', 'N', 
      'S', 'S', 'S', 'S', '', '', 'N', 'N', 
      'N', 'S', 'S', 'N', 'S', 'F', 'N', 'N'], 
     sums: [[7, 4, 0, 0, 0, 0, 0], [3, 0, 0, 0, 0]] 
    }] 
}); 

然後我的柱陣列，其中所述渲染器是：

var counter = 0; 
for (var i = 0; i < Object.kws.length; i++) { 
    var DayOfMonth = []; 
    var DayOfWeek = []; 
    for (var j = 0; j < Object.kws[i].kwDays.length; j++) { 
     var c = counter; 
     DayOfMonth[j] = { 
      text: '<span style="font-size: 87%;">' 
        + Object.kws[i].kwDays[j].day 
        + '.<br>' 
        + Object.kws[i].kwDays[j].dayOfWeek 
        + '.</span>', sortable: false, 
      draggable: false, menuDisabled: true, 
      resizable: false, width: 40, align: 'center', 
      renderer: function (value, meta, record) { 
       return record.data.liste[c]; 

      } 
     }; 
     counter++; 
    } 
} 

該代碼適於和刪節。

這裏是一個picture of the result：

通常在網格中的細胞應顯示列表的計元素在我的商店。

任何人都可以幫助我瞭解我做錯了什麼嗎？

Answer 1

的問題是：

在JavaScript中，函數封裝這是在一個範圍內定義以這樣的方式自己之外的變量，他們有一個「活」的參考變量，而不是快照它在任何特定時間的價值。

Understanding variable capture by closures in Javascript/Node和 How do JavaScript closures work?

由於「C」或「計數器」使用「C」被調用的方法之前被完全遞增，的「c」的值總是在達到的最高值for循環。要解決此問題，需要在創建渲染器函數時捕獲'c'的值。此代碼說明了問題，如何捕捉值來達到你想要的效果：

var counter = 0; 
var dayOfMonths = []; 
var dayOfMonthCaptured = []; 
for (var i = 0; i < 10; i++) { 
    var c = counter; 
    console.log(c); 
    dayOfMonths.push(function() { 
    var index = c; 
    //since counter is incremented fully before this method is called, you get the last value 
    console.log(index); 
    }); 
    //here we pass the current value of c to a new function and capture its current value 
    dayOfMonthCaptured.push((function (index) { 
     return function() { 
     console.log(index); 
     }; 
    })(c)); 
    counter++; 
} 
//this won’t work 
for (day in dayOfMonths) { 
    dayOfMonths[day](); 
} 
console.log("—————————"); 
for (day in dayOfMonthCaptured) { 
    dayOfMonthCaptured[day](); 
}