"Knockout" one, know Knockout, you will love it

Introduced

Knockout is a lightweight JavaScript class library that uses the MVVM design pattern (model, view, ViewModel) to simply and elegantly implement two-way binding and real-time updates to help you use a clean data model to create rich, Responsive user interface.

Knockout has three core features:

1. Graceful dependency Tracking (elegant dependency tracking): Any time the data model changes, the corresponding UI parts are automatically updated;

2. Declarative binding (declarative bindings): Simply by associating the UI with your data model, you can create a complex dynamic UI;

3. High scalability (trivially extensible): Only a few lines of code to implement a custom behavior as a declarative binding;

Other Advantages:

1. Pure JavaScript code;

2. Can be added to your existing Web application at any time;

3. Lightweight, gzip only after 13K;

4. Able to work in almost all major browsers (IE 6+, Firefox, Chrome, Safari, Edge, others);

Ko uses the MVVM design pattern, which is the Model view ViewModel.

A simple example

<data-bind= "text:myitems (). Length"></span> Items

It's that simple, you don't have to write code to update the text content, it will update automatically when the array length changes, similar to this, if we want to take advantage of the array length control button usability only need:

<data-bind= "enable:myitems (). length < 5">Add</  button>

"Knockout" one, know Knockout, you will love it