Shulou(Shulou.com)06/01 Report--

This article mainly introduces how to use the Observables monitoring attributes in Knockout.Js, which has a certain reference value. Interested friends can refer to it. I hope you can learn a lot after reading this article.

Observables Monitoring Properties in Knockout.Js

One of the important features of KO is that it automatically updates your interface when your view model changes. How does KO know when your view model part changes? The answer is: you need to declare your model property as observable because it is a very special JavaScript objects that notifies subscribers of its changes and automatically detects relevant dependencies.

Var myViewModel = {

PersonName: ko.observable ('aehyok')

PersonAge: ko.observable (25)

}

You don't need to modify view at all-all data-bind syntax still works, except that it can monitor the change, and view will update automatically when the value changes.

Monitor the read operation of attributes (read)

/ / read operation of monitoring attributes (read)

Alert (myViewModel.personAge)

Monitor the write operation of attributes (write)

/ / Monitor the write operation of attributes (write)

MyViewModel.personName ("aehyok-Test")

Dependent Observables dependency monitoring properties

What if you already have the monitoring properties firstName and lastName, and you want to display the full name? This requires the use of dependency monitoring properties-these functions are one or more monitoring properties, and if their dependency object changes, they will automatically change.

For example: continue to add two properties, firstName and lastName, to the above ViewModel

Var myViewModel = {

PersonName: ko.observable ('aehyok')

PersonAge: ko.observable (25)

FirstName: ko.observable ('aehyok')

LastName: ko.observable ('Leo')

}

And add a dependency monitoring property to return the full name of the name

/ / dependent monitoring properties

MyViewModel.fullName = ko.dependentObservable (function () {

Return this.firstName () + "+ this.lastName ()

}, myViewModel)

And bind to elements on the View view interface

The fullname is

Thank you for reading this article carefully. I hope the article "how to use Observables Monitoring attributes in Knockout.Js" shared by the editor will be helpful to everyone. At the same time, I also hope that you will support and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.