Как получить длину наблюдаемой в нокауте?

Question

У меня наблюдаемый sizeDetails в нокауте, и мне нужно получить длину в шаблоне нокаута.Моя наблюдаемая ниже

sizeDetails: ko.observable()

При успешном вызове Ajax я установил наблюдаемую, как показано ниже

  self.sizeDetails({sizeGuideDetails: sizeGuideDetails,
                    shopBySizeDetails: shopBySizeDetails
                  });

Как получить sizeGuideDetails и shopBySizeDetails отдельно в шаблоне нокаута

Answer 1

Попробуйте с

<div data-bind="html: sizeDetails().sizeGuideDetails.length"></div>
<div data-bind="html: sizeDetails().shopBySizeDetails.length"></div>

Answer 2

sizeDetails().sizeGuideDetails.length или sizeDetails().sizeGuideDetails().length в зависимости от того, является ли sizeGuideDetails наблюдаемым или нет.То же самое с shopBySizeDetails.

. Вы можете использовать его в любом удобном для вас виде в формате html:

<span data-bind="text: sizeDetails().sizeGuideDetails().length">

или без тегов html:

<!-- ko if: sizeDetails().sizeGuideDetails().length > 0 -->

некоторые html, если условие выполняется

<!-- /ko -->

Answer 3

Поскольку сами ключи являются объектами, мы должны получить их длины, например this .

Это больше касается JavaScript в целом, чем Knockout.Чтобы получить значение наблюдаемого нокаута, вы вызываете его как функцию.например: sizeDetails().В этом случае он вернет объект, и тогда мы сможем получить индивидуальные размеры и вернуть их в массиве или в любом другом формате.

function getSizeDetails(){
    const sizeDetailsObject = self.sizeDetails();
    let sizes = [];
    for (var key in sizeDetailsObject) {
        //check if key exists
        if (sizeDetailsObject.hasOwnProperty(key)) {
            //since key is sure to be an object, get its length like this:
            sizes.push(Object.keys(sizeDetailsObject[key]).length);
        }
    }
    return sizes;
};

Вы также можете создать чисто вычисляемую наблюдаемую , значение которого обновляется автоматически при обновлении sizeDetails.

self.sizes = ko.pureComputed(function(){
    const sizeDetailsObject = self.sizeDetails();
    let sizes = [];
    for (var key in sizeDetailsObject) {
        if (sizeDetailsObject.hasOwnProperty(key)) {
            sizes.push(Object.keys(sizeDetailsObject[key]).length);
        }
    }
    return sizes;
}, self);

Теперь вы всегда можете получить последние размеры, позвонив по номеру self.sizes().

---

Чтобы получить их размеры индивидуальноВы можете поступить так, как упоминали Эрик и Биво в своих ответах.