Question

I have an array of values that I want to display to the user. How do I list them as 1 through instead of 0 through.

HTML

<div id="EditSongContent">
    <div>Verses</div>
        <div data-bind="foreach: Verses">
            Verse: <span data-bind="text: $index"></span>
            <textarea data-bind="value: Verse"></textarea>
        </div>
    <div>Refrain</div>
<textarea data-bind="value: Refrain"></textarea>
</div>

ViewModel

viewSongModel = {
    Song_Title: ko.observable(),
    Order: ko.observable(),
    Refrain: ko.observable(),
    Verses: ko.observableArray()
}

Order is a list of verses and combinations of refrains ie. 1,r,2,r. Not that important for this problem.

Answer 1

$index is an observable. So, one option would be to specify it like:

data-bind="text: $index() + 1"