Question

I have one of my ViewModels as:

Models.DayP = function (data) {
    var self = this;

    this.Mapping = {
        'Actions': {
            create: function (options) {
                return new App.Models.Action(self, options.data);
            }
        }
    };
}

and I have one of ViewModel as :

MPViewModel = function () {
      this.Model = {};
   this.Model.Test = ko.observable();

   //ajax request made below to set the data. Testis type of Models.DayP
}

and I have setup binding as:

<div data-bind="visible: Model.Test().Actions.length <= 0" style="display:none;">
</div>

Problem is this div always shows even though Model.Test().Actions is set after Ajax request, my div never hides itself.

Answer 1

Try calling Actions as a function to get the underlying array:

<div data-bind="visible: Model.Test().Actions().length <= 0" style="display:none;"> </div>