knockout.js

问题 In my ViewModel I have: self.collaps = ko.observableArray([0,0,0,0,0,0,0]); self.shouldShow = function(index) { return self.collaps()[index]; }; My test div: <div data-bind="visible: shouldShow(5)">Shown!</div> I data-bind a button with click: show : self.show = function() { // 1. Index 5 gets true after 2 clicks!!? But UI never updates! self.collaps()[5] = true; // 2. This is push-ing in true starting at index 0 self.collaps.replace(self.collaps()[5], true); // 3. If I combine the two, I get

问题 I'm using both knockout.js and hammer.js in my current project. I created a custom binding handler for the 'tap' event in hammer.js (this should also work for other events such as hold or swipe). My problem is that in this binding handler, I want to call a method that I provide in the data-bind attribute in HTML. According to the knockout documentation, I found out that I should call valueAccessor(), but unfortunately, this doesn't do anything. I've created this Fiddle, which should give you

问题 I have a MVC site where I use Kendo UI and knockout.js to display the pages. One scenario is to get the database information from server through $.getJSON and then display this information on a KendoUI grid. <div data-bind="kendoGrid:{sortable:true, data:users, rowTemplate:'userRowTemplate'}> <table> <thead> <tr> <th>Username</th> <th>First Name</th> <th>Last Name</th> </tr> </thead> </table> </div> <script type="text/html"> <tr> <td data-bind="text: Username"></td> <td data-bind="text:

问题 I have been searching Google to get some ideas and I found some code but it's incomplete and hard to understand. I want to use knockout to bind a list of images. What's the best way to set up a spinner background while the images are loading. I have a spinner class I can set and unset to the background image. Here is the code but it's not clear ko.bindingHandlers.Loading = { update: function (element, valueAccessor, allBindingsAccessor) { var value = valueAccessor(), allBindings =

问题 I am testing out the very awesome Knockoutjs. I am facing a peculiar problem. I found a similar question: Binding initial/default value of dropdown (select) list, but it is not helping, as mine are cascading lists. I make my initialModel as follows, using data from server. var initialModel = @Html.Raw(JsonConvert.SerializeObject(Model)) ; Then I define my viewModel as follows. var viewModel = { evaluationGroups :ko.observableArray(initialModel.EvaluationGroups), SelectedEvaluationArea:ko

问题 I have a deep object graph from the server which I am representing with a Knockout view model structure which omits various unnecessary properties at each level but preserves the basic hierarchy. I'm using the Knockout mapping plugin in both directions. At each view model level below the root, the "constructor" of the current view model accepts its parent view model to keep as a reference, plus the part of the original data necessary to construct itself with. It then creates a new set of

问题 I'd like for my users to not only be able to use multiple filters, but to click an active filter to remove it. Right now, filters only work one at a time and there is no way to remove a filter other than clicking "show all". I'm fairly sure the answer is to use a ko.observableArray to store the filters, add or remove them as appropriate, and loop through them with filteredPeople. Unfortunately, my attempts at this solution did not work as planned, so I'm turning towards SO for help. Here is a

问题 I'm looping through an array and displaying its content through a composition <!-- ko foreach: { data: datas} --> <div> <!-- ko compose: { model: 'show', activationData: { bundle:bundle }, } --> <!-- /ko --> </div> <!-- /ko --> the composition calls a model show.js, that takes the activationData bundle wraps it in an observable and display it in a table function (logger, utils) { var bundle = ko.observable(); var activate = function (data) { // process data.bundle further bundle

问题 This is my first project using knockout.js and I'm having an issue I can't resolve. I'm attempting to have foreach binding 3 levels deep. The first two levels work, but the third one does not. I can't see anything wrong with either my HTML or JavaScript. <div class="skill-list-body"> <div class="inner-skill-list-body"> <div class="skill-list-publication-title" data-bind="text: publication"></div> <div data-bind="foreach: { data: categories, as: 'category' }"> <div> <div class="skill-list

问题 I'm developing a website using Durandal/Knockout/Breeze/WebApi with MVC4 as the back end. I'm querying my api via breeze like so: var getCategories = function() { var query = entityQuery .from('Categories') .orderBy('Order'); return manager.executeQuery(query); }; Then, on my view model: function initCategories() { service.getCategories() .then(querySuccess) .fail(queryFail); function querySuccess(data) { vm.categories(data.results); }; where vm is my bounded view model and categories is of