Beginner Knockoutjs Record 5--computed observables dependency monitoring (2 writable Computed observables writable computed monitoring properties)

Writable computed observables writable computed monitoring properties

The requirements for writable monitoring properties are high and are not commonly used in most situations.

In general, the computed monitoring property has a value calculated from other monitoring properties, and it is usually read-only and looks strange, but it is possible to make the computed monitoring property writable, and you just need to provide a callback function that uses the writable value reasonably to do something.

You can use the computed monitoring properties like regular monitoring properties, as long as you have custom logic to intercept all read and write operations. Just like normal monitoring properties, you can use the link syntax to write object models that have multiple monitoring properties or calculate monitoring properties, such as:

Myviewmodel.fullname (' Joe Smith '). Age (50)

The writable computed monitoring property has a powerful feature that makes it more widely available.

Exameple1:decomposing User Input parsing

Back to the classic example "first name + last name = Full Name", you can do it: set the FullName as a writable computed monitoring property, allowing the user to edit the full name directly, and then the user's input value will be parsed and not mapped back to fi Rstname and LastName monitoring properties, in this example, the write callback function controls the input values and decomposes them into FirstName and lastName, and writes them back to their respective dependent monitoring properties.

<div> First Name: <span data-bind= "Text:firstname" ></span></div><div> Last Name: < Span data-bind= "Text:lastname" ></span></div><div class= "heading" >hello, <input data-bind= " Textinput:fullname "/><div>functionMyviewmodel () { This. FirstName = ko.observable (' Planet ');  This. LastName = ko.observable (' Earth ');        This.fullname = ko.purecomputed ({read:function () {return this.firstname () + "" + this.lastname ();            }, Write:function (value) {var lastspcepos = Value.lastindexof ("");                if (Lastspacepos > 0) {this.firstname (value.substring (0, Lastspacepos));            This.lastname (value.substring (Lastspacepos + 1)); }}, Owner:this})} ko.applybindings (New Myviewmodel ());

Beginner Knockoutjs Record 5--computed observables dependency monitoring (2 writable Computed observables writable computed monitoring properties)