Recently I switched from knockout.js to angular.js, I like both tools, but each of them has its advantages over the “competitor”.
And then a boring evening fell, I decided, just for fun, to mold my MV * instrument.
I don’t really like slimy frameworks, I prefer libraries, and from angular I basically needed 2 things:
scope - data and their monitoring,
applyBindings - to bind this scope to the DOM.
From this I started my bike, in the end I have:
scope = alite. Scope ( ) ; - create scope
alite. applyBindings ( scope , dom ) ; - bind to DOM
Add a variable:
scope. title = 'hello' ;
And make a “bind” in the DOM:
< h1 data-bind = "text: title" > < / h1 >
< input type = "text" data-bind = "value: title" / >
Example:
plnkr.co/edit/nvDY1k?p=previewToDo Example:
plnkr.co/edit/FAcLlC?p=preview')
Directives are ordinary functions that are called when applyBindings comes to data-bind, we add them to alite.directives:
alite. directives . text = function ( element , attrs , scope ) {
var attr = attrs. text ; // Parameter name
scope. $ watch ( attr , function ( value ) { // Subscribe for changes
element. text ( value ) ; // Display the value (via jQuery)
} )
var value = scope. $ eval ( attr ) ; // Get the value
element. text ( value ) ;
} ;
Some factors in the protection of "bike":- In angular, I don’t always like “fussing” with modules. (did it like in knockout.js)
- Why data-bind? That would pop up an error if there is no directive, although you can do it as you please. (similar to knockout.js)
- About jQuery: Angular and Knockout work without jQuery and support different types of browsers, i.e. they have this compatibility inside. But why, if you can use jQuery, you still have to connect it (almost) to every project, for the sake of timepicker, select2, etc.
(same angular.ui requires jquery). Although it may not be needed for example for bundles of Knockout.js + kendo-ui. - “For angular.js there are a lot of ready-made directives!”. Several recent projects with angular.js have shown that many ready-made directives either do not fit or do not exist. In the end, I still had to do them myself. Therefore, a similar bike (but the product version) without ready-made directives would be no worse than angular.js
Directives, although similar can be made in knockoute, but they are different from the box:
bind click: data-bind = "click: on_click ()" - specify what you need to do, instead of specifying the function as in knockout (like in angular.js)
bind repeat: - we twist the element itself, not its contents (as in angular.js)
The “core” (for the time being) consists of only about 200 lines, so it can be easily repainted by itself.
PS: This is just a prototype bike, so something in it will not work.
Sources