knockout.js | 易学教程

Why doesn't ko.observableArray.length return length of underlying array?

阅读更多关于 Why doesn't ko.observableArray.length return length of underlying array?

问题 Using Knockout, when working with an observableArray , you must grab the underlying array ( myArray() ) in order to read the length. I don't understand why myArray.length wouldn't return the underlying array's length (instead it returns 0). Is this a bug or is there reason which I've simply missed? JSFiddle: http://jsfiddle.net/jsm11482/LJVWE/ JS/Model var data = { name: ko.observable("Test"), items: ko.observableArray([ { name: ko.observable("First Thing"), value: ko.observable(1) }, { name:

Javascript in Edge only works with devtools open

阅读更多关于 Javascript in Edge only works with devtools open

问题 The problem I have is that in MS edge, my imagemap functionality's only work partially. It is powered by the knockout FW. On bigger imagemaps, it doesn't registers the entire imagemap into the viewmodel. As a result all the hover effects and the on-click styling for the imagemap stops working. However this is only issue with big imagemaps, also noteworthy is that the part that is registered does have the on-click function triggered (just not the styling). The most remarkable problem with this

Knockout wrap value binding

阅读更多关于 Knockout wrap value binding

问题 I am using mathias bynen's placeholder code and I wanted to use it along with knockout, if I do a simple custom binding like this: ko.bindingHandlers.placeholder = { init: function (element) { $(element).placeholder(); } }; and the html <input placeholder = "Line 1" data-bind="placeholder: {}, value: addressLine1"> It works, but I would like to "merge" them into one custom binding, for using it like <input placeholder = "First Name" data-bind="placeholderValue: firstName"> So I tried this

Knockoutjs : How to add title to options in select

阅读更多关于 Knockoutjs : How to add title to options in select

问题 I use Knockoutjs options binding to populate my selects as this <select data-bind="value: val, options: options, optionsText: 'text', optionsValue: 'ID'"> </select> But for some option, the text is the same. Then I would like to add a title attribute to add information. Can I do that with knockout without modifying knockoutjs itself ? May be using a function in optionsText, but I can't see How 回答1: You can do it using the foreach binding, like this: <select data-bind="foreach: options, value:

Why is afterRender never called?

阅读更多关于 Why is afterRender never called?

问题 Have a look at the following sample HTML. It is a simple KO foreach binding and a button to add a new item to the observableArray . The addition works fine and the new item shows up. However, the afterRender method is never called - not after the initial binding and not after a new item is added (and rendered). Why? Fiddle: http://jsfiddle.net/CQNm6 HTML <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript" src=

Knockout Validation of two interdependent fields

阅读更多关于 Knockout Validation of two interdependent fields

问题 Consider the following piece of code - var MyObjectModel = function(myObject){ var self = this; self.myNumber1 = ko.observable(myObject.number1).trimmed(); self.myNumber2 = ko.observable(myObject.number2).trimmed(); I would like to extend myNumber1 and myNumber2, to add knockout validations such that it throws an error if both are empty, and stays fine if either has a value. Any idea how I could go about achieving this ? 回答1: You can use an ko.computed to create a function which checks if at

Uncaught TypeError: Cannot convert a Symbol value to a string

阅读更多关于 Uncaught TypeError: Cannot convert a Symbol value to a string

问题 I'm receiving the following JSON from the server: And then I'm trying to map it using $.map in the AJAX call's success , as follows: $.ajax({ type: "GET", url: urlGetStaticData, success: function (data) { self.AvailableTags(data[0].Value); self.MeasurementUnits($.map(data[1].Value, function (item) { return ko.mapping.fromJS(item) })); and the last line throws the following exception: Uncaught TypeError: Cannot convert a Symbol value to a string when it tries to map the property with the

Posting a large JSON object to ASP.NET MVC

阅读更多关于 Posting a large JSON object to ASP.NET MVC

问题 I'm using KnockoutJS's mapping pluggin to convert my model into Knockout objects. But I'm having issues sending the large json object back to the server. My ajax call looks like this: $.ajax({ url: "/home/DoStuff", type: "POST", data: JSON.stringify({ deal: ko.toJS(myObjectViewModel) }), contentType: "application/json", dataType: "json", success: function (result) { console.log(result); }, error: function (xhr, status, message) { console.log(xhr); } }); Executing this script never hits the

How to data-bind content for an iframe using KnockoutJS?

阅读更多关于 How to data-bind content for an iframe using KnockoutJS?

问题 Can anyone please tell me how to bind data to an iframe using Knockout? I have tried to do this as below, but it is not working as expected: <iframe data-bind ="attr: { src: testcontent}"></iframe> And Javascript: var ViewModel = function (content) { this.testcontent = ko.observable(content); }; ko.applyBindings(new ViewModel("Hello World!!")); I want to add the text "Hello Content" into the iframe . Can anyone please help me on this? 回答1: Warning: this obviously has security implications!

How might I cancel a change to an observable array w/ Knockout 3.0?

阅读更多关于 How might I cancel a change to an observable array w/ Knockout 3.0?

问题 I have a change occurring to an array. I am using Sanderson's latest array subscription method to catch the add/delete change. In this subscription is where I intend to bundle and send my request over the wire. If the request fails for any reason I want to be able to cancel any possible changes to the collection. I have verified that this subscription is hit before the change propagates so I assume there would be a way to say "STOP DON'T DO IT" however I can't figure out how. As my example...