title: how to pass font-size in object and how to bind it in html
body: <p>how can i dynamically change the font-size of div content by passing it in object </p>
  
  <pre><code>$scope.Items = [
        { sizeX: 2, sizeY: 1, row: 0, col: 0,  obj:{data:54565463,right:67566,title:'headers',font-size:'20px'}},
        { sizeX: 2, sizeY: 1, row: 0, col: 0,  obj: {data:65476756,right:123,title:"Income"}}
        ] 
  
  })
   app.directive('myWidget',function(){
  
          return{
  
              restrict:"EA",
              scope:{ 
              title:'@',
              data:'=',
              },
              templateUrl:'spare.html',
              }
  
          });
  </code></pre>
  
  <p>and how to bind  it in html here is my html</p>
  
  <pre><code>&lt;div gridster &gt; 
  &lt;ul&gt;
  &lt;li gridster-item="item" ng-repeat="item in Items"&gt;
     &lt;div my-widget data="item.obj" ng-style="myStyle"&gt; &lt;/div&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and spare html </p>
  
  <pre><code>&lt;span ng-controller="myController" &gt;
  &lt;div class="panel-body"  &gt;
  &lt;h1  class="title" &gt;{{data.title}}&lt;/h1&gt;
  &lt;i class="fa fa-dollar"&gt;&lt;/i&gt;{{data.data}}
  &lt;/h1&gt;&lt;/div&gt;
   &lt;p id="rightcorner"&gt;&lt;i class="fa fa-level-up"&gt;&lt;/i&gt;{{data.right}} 
   &lt;/p&gt;
      &lt;/span&gt;
  </code></pre>