Category

Coding

Frameworks

By | Coding | No Comments

Some interesting developments in frameworks — these metrics come from NPM downloads and give insight into framework popularity — you can see big growth with Express, React, and jQuery (still!); and Angular (1.x probably) still holding strong; however VueJS rapidly catching up to Angular and likely to surpass soon (also note: webpack package manager is growing strongly in popularity):

Source: https://www.npmjs.com/npm/the-state-of-javascript-frameworks-2017-part-3-back-end-frameworks

Aurelia: Powerful ValueConverters

By | Coding | No Comments

This post is a quick observation of how flexible the valueconverters feature is. I won’t cover what valueConverters are because that is well covered else where (Eisenberg’s post).

However, I wanted to show a flexible use of. Let’s say the template row is returning an array of keys, which correspond to a list:

constructor(){
   this.optionList = [
       { value: 10, label: "Option 10", icon: "<i class='glyph-icon icon-coffee></i>" },
       { value: 20, label: "Option 20", icon: "<i class='glyph-icon icon-leaf></i>" },
       { value: 30, label: "Option 30", icon: "<i class='glyph-icon icon-star></i>" }
   ];
   this.selectedIdSet = [10,30];
}

export class LabelizeValueConverter {
   toView(valueArray, listArray) {
      var html = '';
      for(let val of valueArray){
         for( let i of listArray ){
            if( i.value==val )
               html += i.value+' '+i.icon+' ';
         }
      }
      return html;
   }
}

Now we can even pass in that array of options into the value converter (useful if we multiple option arrays we can use, and we want to use the same valueConverter).

<span innerhtml.bind="selectedIdSet | labelize: optionList"></span>