Вычисленный Knockout.js не отображается при выборе пользователя - PullRequest
Новая
       35

Вычисленный Knockout.js не отображается при выборе пользователя

0 голосов
/ 27 мая 2018

У меня есть таблица, где каждая строка связана с моделью Knockout.js: 

foreach: treatmentsOptions

Я бы хотел, чтобы пользователь мог нажимать кнопку «Добавить» в каждой строке таблицы.и для того, чтобы это было окрашено по-разному, и может быть несколько добавленных строк.Я думал, что сделаю это, присвоив значение свойству модели с именем IsSelected, а затем использую привязку стиля.

У меня есть этот код, который, кажется, работает, но, очевидно, не фильтруется в зависимости от того, что я хочу:

self.treatmentsOptions = ko.computed (function () {_dummyObservable (); 

var is_linked = $.map(self.treatments(), function (obj) {
    for (var i = 0; i < self.linkedItems().length; i++) {
        if (self.linkedItems()[i].PriceListItemId() == obj.Id())
            return obj.Id();
    }
});

for (var i = 0 ; i < self.treatments().length ; i++) {

    self.treatments()[i].IsSelected = ko.observable(false);

    if (i % 2 == 0) {
        self.treatments()[i].IsSelected = ko.observable(true);
    }
    else {
        self.treatments()[i].IsSelected = ko.observable(false);
    }
}


var options = self.treatments();
return options;

});

Теперь я хочу, чтобы всякий раз, когдапользователь нажимает «Добавить», и это вычисляется, что следующий код будет работать: 

self.treatmentsOptions = ko.computed(function () {
    _dummyObservable();

    var is_linked = $.map(self.treatments(), function (obj) {
        for (var i = 0; i < self.linkedItems().length; i++) {
            if (self.linkedItems()[i].PriceListItemId() == obj.Id())
                return obj.Id();
        }
    });

    for (var i = 0 ; i < self.treatments().length ; i++) {

        self.treatments()[i].IsSelected = ko.observable(false);

        if (is_linked.includes(parseInt(self.treatments()[i].Id()))) {
            self.treatments()[i].IsSelected = ko.observable(true);
        }
        else {
            self.treatments()[i].IsSelected = ko.observable(false);
        }
    }


    var options = self.treatments();
    return options;

});

Я бы хотел, чтобы каждая строка таблицы была цветной.Что мне здесь не хватает?

1 Ответ

0 голосов
/ 27 мая 2018

Вы устанавливаете ko.observable s, вызывая их со значением.Этот блок кода выглядит очень подозрительно: 

// Don't do this:
self.treatments()[i].IsSelected = ko.observable(false);

if (i % 2 == 0) {
    self.treatments()[i].IsSelected = ko.observable(true);
}
else {
    self.treatments()[i].IsSelected = ko.observable(false);
}

Вероятно, его следует заменить на: 

self.treatments()[i].IsSelected(i % 2 === 0);

Обратите внимание, что строки чередующегося цвета можно стилизовать в css с помощью nth-child(odd) иnth-child(even) селекторы.

Вы также можете использовать свойство $index в контексте привязки foreach привязки.

...