knockout-3.0 | 易学教程

Is there something like AngularJS' filters for Knockout.js?

阅读更多关于 Is there something like AngularJS' filters for Knockout.js?

问题 angularjs has the angular-filters concept built-in, so it's very easy to reduce a dataset to those elements that match for example a user-input. Is there something similar available for knockout.js? Of course I could implement it on my own, using plain old Javascript, but I'm not a performance expert so my own solution would probably be horribly slow. 回答1: Yes, Steve Sanderson has created the knockout-projections plugin for knockout. This is similar to angular-filters where you can apply a

Sorting not working with Knockout and Isotope

阅读更多关于 Sorting not working with Knockout and Isotope

问题 Update: forgot the one question per question rule. Cut second question out of this one. Trying to make a list of users sortable by different criteria with animation. Was already using Knockout so this demo seemed like a good direction to take. I switched to an Isotope 2.0 fork of the integration code here. Sometimes the sorting doesn't update properly, as shown in this version - http://codepen.io/matelich/pen/PPoqdz - Medal and Component should have #0 and #1 switched from each other, but the

Can't bind observable inside component to an If-binding

阅读更多关于 Can't bind observable inside component to an If-binding

问题 I am trying to load a component conditionally using an if-binding. However, I can't change the value of the observable that is assigned to the if-binding using the construct below since, I think, the functions that should change the observable are outside the view model. I initially did this because this is what's done in the sample in KnockoutJS's site: define(["jquery", "knockout", "ko-postbox", "text!./parent.html"], function($, ko, kopost, template) { ko.postbox.subscribe("child-click",

Cause Knockout to re-draw data columns based on changes to my column model when using tempate nodes binding

阅读更多关于 Cause Knockout to re-draw data columns based on changes to my column model when using tempate nodes binding

问题 My problem scenario is almost identical to this one but the table I'm drawing has TD cells with more complex bindings, each binding unique to the column being bound. Sometimes it's just the HTML that's unique. In other words, it isn't good enough to loop the columns using a databind=foreach and simply nest a <TD> that does a text binding. I can get my table to render on initial page draw, using a template{nodes:xxx} binding, where I pass in an array of DOM nodes.. like this: <table> <thead>

Knockout: Table Paging

阅读更多关于 Knockout: Table Paging

问题 I tried paging under my Model. I could correctly get Arrow to move depending on how many Records I posess. But data is not refelcted/decreased/increased depending on Max rows to show on a Page. Please find below Fiddle Refrrence Example I used is Here /************* Start of logic for Paging ******/ self.items = ko.observableArray(); this.all = self.items; self.pageNumber = ko.observable(0); self.nbPerPage = 2; // I think this is somewhere I am missing the functionality. this.totalPages = ko

Showing a concatenated string from multiple values of observable array

阅读更多关于 Showing a concatenated string from multiple values of observable array

问题 I have an observable array as follows.. var myObservableArray = ko.observableArray([ { name: "Bungle", type: "Unknown" }, { name: "George", type: "Unknown" }, { name: "Zippy", type: "Unknown" } ]); I wish to fill a select listbox from elements in the observable array such that the option names are concatenated string of 'name' and 'type' like "Bungle-Unknown","George-Unknown",.etc The optionvalues are just 'name'. Any help is sincerely appreciated. Thanks 回答1: In your binding on the select

Access knockout binding from child element

阅读更多关于 Access knockout binding from child element

问题 Lets say i have this: <div data-bind="enable: false"> <div data-bind="someCustomBinding: myValue"></div> </div> Is is possible for me to access the 'enable' binding of the parent container from within the custom binding? == Clarification: == In a custom binding you can gain access to the current binding value with the valueAssessor. you can also gain access to other bindings through allBindings and even values on different related contexts via the bindingContext. I was just wondering if you

How to use “with” binding in Knockout JS with nested View Models?

阅读更多关于 How to use “with” binding in Knockout JS with nested View Models?

问题 I am trying to write a template to fill a form for multiple persons. I do not want to go in for "foreach" binding or template. I am just trying to save all the data in the simple form with 5 inputs using a button that will add the person to the observableArray and clear the form for the next person. I have pasted my entire code below: <html> <head> <title>Test Knockouts</title> </head> <body> <div id="rootDiv"> <ul data-bind="with: Person"> <li data-bind="event: { click: $data

Passing $index and $data as arguments to function for click handler

阅读更多关于 Passing $index and $data as arguments to function for click handler

问题 I am passing $index and $data to the change_model function. The function is expecting 2 parameters in the following order: (index, data) . From the viewModel I am passing click: $root.change_model.bind($data, $index()) . Within the function index prints $data , and data prints index : values are reversed. self.change_model = function(index, data) { self.patternSelectedIndex(index); selected_door = data.file; create_door(); }; <div data-bind="foreach: x.patterns"> <div class="thumbnail" data

Computed stops triggering forever if dependency is inside of false branch statement

阅读更多关于 Computed stops triggering forever if dependency is inside of false branch statement

I'm faced a problem that my computed observable stops triggering after some sequence of dependency changes. Finally I found out the point: if dependency was inside of false branch statement during latest evaluation, computed will not be triggered next time even if condition became true before evaluation finished . Here is a sample: https://jsfiddle.net/sgs218w0/1/ var viewModel = new function(){ var self = this; self.trigger = ko.observable(true); self.fire = function(){ self.trigger(! self.trigger()); }; self.content = function(){ var test = 3; return ko.computed(function(){ alert("triggered!