7

例:

ビューモデルでは、

//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');

                }
            })

//viewModel

 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 を使用できます。しかし、私の要件は、バインディングのみを非表示/表示することです。これを行う方法を教えてください。前もって感謝します。

4

2 に答える 2

12

visibleそうです、observable の値が null、未定義、または空の文字列でない場合にのみ 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" />
于 2013-04-29T19:10:12.967 に答える
0

この方法を使用すると、実装しようとしているものを解決するのに役立ちます

self.ClickLoad=ko.observable(false);
self.Enable=ko.observable();
Enable=function(){
    self.ClickLoad=ko.observable(true);
    console.log(self.ClickLoad);
}

<div data-bind="visible: Enable()">
    <p>sjknscjksnajcn</p>
</div>
于 2016-10-24T11:59:39.010 に答える