$index在淘汰赛中.js显示字母而不是数字

Question

我想在 KnockoutJS 中使用 $index 来显示字母而不是数字。

A. 项目1
B. 项目2
C. 项目3

我该怎么做？？

Answer 1

您可以使用

list-style-type为 upper-alpha 的ol来执行此操作，如果这符合您的需求。例如：

.HTML：

​<ol data-bind​​​​​​​​​​​="foreach: items" class="alpha">
    <li data-bind="text: $data"></li>
</ol>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

.CSS：

.alpha {
    list-style-type: upper-alpha;
}​

JavaScript：

function ViewModel() {
    this.items = ko.observableArray([
        "Apples",
        "Oranges",
        "Bananas"
    ]);
}
var model = new ViewModel();
ko.applyBindings(model);​

示例：http://jsfiddle.net/andrewwhitaker/CCNtR/1/

Answer 2

看看这个小提琴： http://jsfiddle.net/jearles/RhmTb/19/

关键是编写一个视图模型方法来将索引转换为字母。

<div data-bind="foreach: names">
  <div>
    <span data-bind="text: $root.indexLetter($index())"></span>.
    <span data-bind="text: $data"></span>
  </div>      
</div>   

--

var viewModel = {
  names : ['one', 'two', 'three', 'four', 'five', 'six'],
  indexLetter : function(index) {
    return String.fromCharCode(65 + index);
  }
}
ko.applyBindings(viewModel);