fix (+each) component bindings

Author: tenbits

bower.json

@@ -1,6 +1,6 @@
 {
     "name": "maskjs",
-    "version": "0.72.43",
+    "version": "0.72.46",
     "homepage": "https://github.com/atmajs/MaskJS",
     "authors": [
         "Alex Kit <[email protected]>"

package-lock.json

@@ -1,7 +1,7 @@
 {
     "name": "maskjs",
     "description": "Template / Markup / HMVC Engine",
-    "version": "0.72.43",
+    "version": "0.72.46",
     "homepage": "http://atmajs.com/mask",
     "contributors": [
         {

package.json

@@ -14,18 +14,17 @@ const EachBinded = {
     meta: {
         serializeNodes: true
     },
-    serializeNodes: function(node){
+    serializeNodes (node){
         return mask_stringify(node);
     },
     //modelRef: null,
-    render: function(model, ctx, container, ctr, children){
+    render (model, ctx, container, ctr, children){
         //this.modelRef = this.expression;
-        var array = expression_eval(this.expression, model, ctx, ctr);
-        if (array == null)
+        let array = expression_eval(this.expression, model, ctx, ctr);
+        if (array == null) {
             return;
-
+        }
         arr_createRefs(array);
-
         build(
             this.nodes,
             array,
@@ -36,8 +35,8 @@ const EachBinded = {
         );
     },
 
-    renderEnd: function(els, model, ctx, container, ctr){
-        var compo = new EachStatement(this, this.attr);
+    renderEnd (els, model, ctx, container, ctr){
+        let compo = new EachStatement(this, this.attr);
 
         _renderPlaceholder(this, compo, container);
         _compo_initAndBind(compo, this, model, ctx, container, ctr);
@@ -46,34 +45,34 @@ const EachBinded = {
 
 };
 
-var EachItem = class_create({
+const EachItem = class_create({
     compoName: 'each::item',
     scope: null,
     model: null,
     modelRef: null,
     parent: null,
     //#if (NODE)
-    renderStart: function(){
-        var expr = this.parent.expression;
+    renderStart (){
+        let expr = this.parent.expression;
         this.modelRef = ''
             + (expr === '.' ? '' : ('(' + expr + ')'))
             + '."'
             + this.scope.index
             + '"';
     },
     //#endif
-    renderEnd: function(els) {
+    renderEnd (els) {
         this.elements = els;
     },
-    dispose: function(){
+    dispose (){
         if (this.elements != null) {
             this.elements.length = 0;
             this.elements = null;
         }
     }
 });
 
-var EachStatement = class_create(ALoopBindedStatement, {
+const EachStatement = class_create(ALoopBindedStatement, {
     compoName: '+each',
     constructor: function EachStatement(node, attr) {
         this.expression = node.expression;
@@ -85,13 +84,13 @@ var EachStatement = class_create(ALoopBindedStatement, {
         this.node = node;
         this.components = node.components;
     },
-    _getModel: function(compo) {
+    _getModel (compo) {
         return compo.model;
     },
-    _build: function(node, model, ctx, component) {
-        var fragment = _document.createDocumentFragment();
+    build (model) {
+        let fragment = _document.createDocumentFragment();
 
-        build(node.nodes, model, ctx, fragment, component);
+        build(this.node.nodes, model, {}, fragment, this);
 
         return fragment;
     }
@@ -100,18 +99,15 @@ var EachStatement = class_create(ALoopBindedStatement, {
 // METHODS
 
 function build(nodes, array, ctx, container, ctr, elements?) {
-    var imax = array.length,
-        nodes_ = new Array(imax),
-        i = 0, node;
-
-    for(; i < imax; i++) {
-        node = createEachNode(nodes, i);
+    let imax = array.length;
+    for(let i = 0; i < imax; i++) {
+        let node = createEachNode(nodes, i);
         builder_build(node, array[i], ctx, container, ctr, elements);
     }
 }
 
 function createEachNode(nodes, index){
-    var item = new EachItem;
+    let item = new EachItem;
     item.scope = { index: index };
 
     return {

projects/mask-binding/src/statements/loop/each.ts

@@ -46,47 +46,6 @@ export class ObservableFor extends ALoopBindedStatement {
         this._beforeRender();
     }
 
-    // render (model, ctx, container, ctr, children){
-    //     const directive = For.parseFor(this.expression);
-    //     const attr = this.attr;
-
-    //     attr[attr_PROP_1] = directive[0];
-    //     attr[attr_PROP_2] = directive[1];
-    //     attr[attr_TYPE] = directive[2];
-    //     attr[attr_EXPR] = directive[3];
-
-    //     let subs = expression_subscribe(
-    //         directive[3]
-    //         , model
-    //         , ctx
-    //         , ctr
-    //         , this.onChanged
-    //         , is_NODE ? true : false
-    //     );
-
-    //     let value = expression_eval(directive[3], model, ctx, ctr);
-    //     if (value == null) {
-    //         return;
-    //     }
-
-    //     if (is_Array(value)) {
-    //         arr_createRefs(value);
-    //     }
-
-    //     For.build(
-    //         value,
-    //         directive,
-    //         this.nodes,
-    //         model,
-    //         ctx,
-    //         container,
-    //         this,
-    //         children
-    //     );
-    // }
-
-
-
     getHandler (name, model){
         return For.getHandler(name, model);
     }

projects/mask-binding/src/statements/loop/for.ts

@@ -24,19 +24,20 @@ export function _compo_initAndBind(
     container,
     controller
 ) {
+    const expr: string = compo.expr ?? compo.expression ?? node.expression;
     compo.parent = controller;
     compo.model = model;
     compo.ctx = ctx;
     compo.refresh = fn_proxy(compo.refresh, compo);
     compo.binder = expression_createBinder(
-        compo.expr || compo.expression,
+        expr,
         model,
         ctx,
         controller,
         compo.refresh
     );
     expression_bind(
-        compo.expr || compo.expression,
+        expr,
         model,
         ctx,
         controller,