Javascript 触发单击事件时设置模型值

我有一个主干视图，它以如下格式写出棒球队的统计数据：

Wildcats | Players: 10 | Ages: 8-10 | Coach: Smith | Dates Active: 5/1/2021 - 8/1/2021     [Edit]
Ospreys  | Players: 12 | Ages: 8-11 | Coach: Jones | Dates Active: 6/2/2021 - 9/28/2021    [Edit]
Whales   | Players: 14 | Ages: 8-10 | Coach: Miri  | Dates Active: 4/29/2021 - 8/2/2021    [Edit]

<div class="minor">  {{ model.teamName }} </div>

<span class="datePicker"></span>

    new DatePicker({
        el: this.$('.datePicker'),
        model: this.model,
        modelAttr: 'activeDate'
    }).render();

1/1/1970 - 1/1/1970

当我单击[Edit]按钮时，它会在视图中触发此事件：

'click #editTeam': function () {
    this.$('.editTeam, .displayTeam').toggle();
}

在“编辑”视图中，除了日期以外的所有内容看起来都很好

当我将值写入HTML模板时，它们如下所示：

Wildcats | Players: 10 | Ages: 8-10 | Coach: Smith | Dates Active: 5/1/2021 - 8/1/2021     [Edit]
Ospreys  | Players: 12 | Ages: 8-11 | Coach: Jones | Dates Active: 6/2/2021 - 9/28/2021    [Edit]
Whales   | Players: 14 | Ages: 8-10 | Coach: Miri  | Dates Active: 4/29/2021 - 8/2/2021    [Edit]

<div class="minor">  {{ model.teamName }} </div>

<span class="datePicker"></span>

    new DatePicker({
        el: this.$('.datePicker'),
        model: this.model,
        modelAttr: 'activeDate'
    }).render();

1/1/1970 - 1/1/1970

因此，当我单击[Edit]按钮时，日期从未设置为正确的行，因此结果如下所示：

Wildcats | Players: 10 | Ages: 8-10 | Coach: Smith | Dates Active: 5/1/2021 - 8/1/2021     [Edit]
Ospreys  | Players: 12 | Ages: 8-11 | Coach: Jones | Dates Active: 6/2/2021 - 9/28/2021    [Edit]
Whales   | Players: 14 | Ages: 8-10 | Coach: Miri  | Dates Active: 4/29/2021 - 8/2/2021    [Edit]

<div class="minor">  {{ model.teamName }} </div>

<span class="datePicker"></span>

    new DatePicker({
        el: this.$('.datePicker'),
        model: this.model,
        modelAttr: 'activeDate'
    }).render();

1/1/1970 - 1/1/1970

---

我想知道，当我单击“编辑”按钮事件时，是否有办法为正确的行设置日期？

似乎您没有将模型与第三方日期选择器绑定。如何在第三方日期选择器中设置模型中的日期，以及在用户操作后如何将日期选择器中的日期设置到模型中？