Function 每个项目的淘汰调用函数

我有这个：

function viewModel() {
        this.items = ko.observableArray(initialData);
    }

ko.applyBindings(viewModel());

…这是：

<div data-bind="foreach:  items">
 <span data-bind="text: cutOff($data)"></span>
</div>

正确的语法对我来说仍然是个谜。这能做到吗？

---

谢谢

更好的方法是创建一个自定义绑定，返回文本的截止版本。这样，你就可以在任何需要删除文本的地方重复使用它

 ko.bindingHandlers.trimText = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        var trimmedText = ko.computed(function () {
            var ActualText = ko.utils.unwrapObservable(valueAccessor());
            var defaultMaxLength = 20;
            var minTrimLength = 5;
            var maxTrimLength = ko.utils.unwrapObservable(allBindingsAccessor().trimLength) || defaultMaxLength;
            if (maxTrimLength < minTrimLength) maxTrimLength = minTrimLength;
            var textOutput = ActualText.length > maxTrimLength ? ActualText.substring(0, maxTrimLength - 1) + '(...)' : ActualText;
            return textOutput;
        });
        ko.applyBindingsToNode(element, { text: trimmedText }, viewModel);
        return { controlsDescendantBindings: true};
    }
};

ko.bindingHandlers.trimText={
init：函数（元素、valueAccessor、allBindingsAccessor、viewModel）{
var trimmedText=ko.computed（函数（）{
var ActualText=ko.utils.unwrapobbservable（valueAccessor（））；
var defaultMaxLength=20；
var minTrimLength=5；
var maxTrimLength=ko.utils.unwrapObservable（allBindingsAccessor（）.trimLength）| | defaultMaxLength；
如果（maxTrimLengthmaxTrimLength？ActualText.substring（0，maxTrimLength-1）+'（…）'：ActualText；
返回文本输出；
});
applybindingstoode（元素，{text:trimmedText}，viewModel）；
返回{ControlsDescentBindings:true}；
}
};

视图：

<!-- default cutOff length -->
<div data-bind="trimText: ItemText"></div> 
<!-- cutOff length -->
<div data-bind="trimText: ItemText, trimLength: 40"></div>

---

示例：

更好的方法是创建一个自定义绑定，该绑定返回文本的截止版本。这样，你就可以在任何需要删除文本的地方重复使用它

 ko.bindingHandlers.trimText = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        var trimmedText = ko.computed(function () {
            var ActualText = ko.utils.unwrapObservable(valueAccessor());
            var defaultMaxLength = 20;
            var minTrimLength = 5;
            var maxTrimLength = ko.utils.unwrapObservable(allBindingsAccessor().trimLength) || defaultMaxLength;
            if (maxTrimLength < minTrimLength) maxTrimLength = minTrimLength;
            var textOutput = ActualText.length > maxTrimLength ? ActualText.substring(0, maxTrimLength - 1) + '(...)' : ActualText;
            return textOutput;
        });
        ko.applyBindingsToNode(element, { text: trimmedText }, viewModel);
        return { controlsDescendantBindings: true};
    }
};

ko.bindingHandlers.trimText={
init：函数（元素、valueAccessor、allBindingsAccessor、viewModel）{
var trimmedText=ko.computed（函数（）{
var ActualText=ko.utils.unwrapobbservable（valueAccessor（））；
var defaultMaxLength=20；
var minTrimLength=5；
var maxTrimLength=ko.utils.unwrapObservable（allBindingsAccessor（）.trimLength）| | defaultMaxLength；
如果（maxTrimLengthmaxTrimLength？ActualText.substring（0，maxTrimLength-1）+'（…）'：ActualText；
返回文本输出；
});
applybindingstoode（元素，{text:trimmedText}，viewModel）；
返回{ControlsDescentBindings:true}；
}
};

视图：

<!-- default cutOff length -->
<div data-bind="trimText: ItemText"></div> 
<!-- cutOff length -->
<div data-bind="trimText: ItemText, trimLength: 40"></div>

---

示例：

假设在viewModel中定义了截止函数，如下所示

function viewModel() {
        this.items = ko.observableArray(initialData);

        this.cutOff= function (fieldName) {
            if (fieldName.Length > 40)
                return fieldName.substring(0, 40) + "(...)"
            else
                return fieldName;

         }

    }

您需要通过

$parent

bindingContext访问切断功能。所以，在HTML页面中，代码应该是这样的。在

foreach

循环中，span元素的绑定上下文将是单个项或

$data

。如果需要访问ViewModel中定义的函数，则需要更改绑定上下文，

$parent

允许访问父上下文

<div data-bind="foreach:  items">
 <span data-bind="text: $parent.cutOff($data)"></span>
</div>

---

假设截断函数在viewModel中定义，如下所示

function viewModel() {
        this.items = ko.observableArray(initialData);

        this.cutOff= function (fieldName) {
            if (fieldName.Length > 40)
                return fieldName.substring(0, 40) + "(...)"
            else
                return fieldName;

         }

    }

您需要通过

$parent

bindingContext访问切断功能。所以，在HTML页面中，代码应该是这样的。在

foreach

循环中，span元素的绑定上下文将是单个项或

$data

。如果需要访问ViewModel中定义的函数，则需要更改绑定上下文，

$parent

允许访问父上下文

<div data-bind="foreach:  items">
 <span data-bind="text: $parent.cutOff($data)"></span>
</div>

---

-函数未定义我看到了代码的问题。更新了答案，以确保你的代码正常工作。我正试图切断你的电话。请注意，错误在于您在应用

ko.applyBindings（new viewModel（））时忘记了“new viewModel”中的
new
-未定义函数切断我看到了代码的问题。更新了答案，以确保你的代码正常工作。我正试图切断你的电话。请注意，错误在于您在应用
ko.applyBindings（new viewModel（））时忘记了“new viewModel”中的
new