knockout.js – 如何通过绑定显示或隐藏div

前端之家收集整理的这篇文章主要介绍了knockout.js – 如何通过绑定显示或隐藏div前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
对于Eg:

viewmodel中,

//Makes webApi call to get the data from some repository
function GetData() {
            var data = http.get(apiUrl)
            .success(function (result) {
                 if (result != null || result !='')
                 {
                    // success display the data
                    vm.dataDisplay;
                 }
               else {
                    vm.errorMsg('No data');

                }
            })

//视图模型

var vm = {
            activate: activate,dataDisplay: ko.observableArray(),errorMsg:ko.observable(''),};
        vm.activate();
        return vm;

//视图.
预期.

If( errorMsg == 'No Data')
{
// show errordata div and hides displayData div
<div class="errorData" data-bind="text:errorMsg"/>
}
else
{
// Show displayData div and hide errorData div
<div class="displayData" data-bind="text:dataDisplay" />
}

如何通过绑定实现这一点?

我可以使用ko attr或者可见.
但我的要求是仅通过绑定隐藏/显示.
请建议我怎么做?
提前致谢.

解决方法

你是对的,你只需要使用 visible绑定,如果observable的值不是null,undefined或空字符串,它只会显示HTML元素.这应该工作:
<div class="errorData" data-bind="visible: errorMsg,text:errorMsg"/>

<div class="displayData" data-bind="visible: dataDisplay,text:dataDisplay" />

另外,如果“dataDisplay”确实是一个数组,则必须使用:

<div class="displayData" data-bind="visible: dataDisplay().length,text:dataDisplay" />

猜你在找的JavaScript相关文章