Angularjs method of realizing elastic box layout _angularjs

Recently in writing a simple layout framework, in fact, the function is very similar. But the goal requirement is to use the simplest possible code to implement some required functions. Application in some cases requiring fast loading.

CSS Section

. flex-row,.flex{
Display:-webkit-flex;display:flex;
Flex-direction:row
}
. flex-col{
display:-webkit-flex;
Display:flex;
Flex-direction:column;
}

JavaScript section

. directive (' Flex ', [function () {return
{
restrict: ' A ',
scope:{' flex ': ' = '},
link:function (s,e , a) {e.css (' Flexgrow ', S.flex);}}
;
}];

Usage:

<div class= "Flex-row" >
<div flex= "1" > One </div>
<div flex= "6" > Two </div>
</div>

The above is a small set to introduce the ANGULARJS to achieve elastic box layout, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!