ng-repeat元素中的角度材料弯曲

我正在使用角材料行和列布局构建动态表格。我正在使用ng-repeat基于名为scope.tableLayout的对象数组中的预定义列构造列。每个对象都有一个弹性值。我想要做的是根据对象中的flex值设置表格列的宽度。有没有办法做到这一点？ng-repeat元素中的角度材料弯曲

我的JSfiddle表格附加了我试图将flex设置为flex =“col.flex”而没有运气的地方。任何帮助表示赞赏。 My Code in JSfiddle

<div ng-app="myApp" ng-controller="mainCtrl"> 
    <script type="text/ng-template" id="/template"> 
     <button ng-click="testFn()">Test</button> 
     <div layout="row"> 
      <div flex='col.flex' ng-repeat="col in column"><span>HEADER{{$index}}</span> 
       <div layout="column"> 
        <div flex style="border: 1px solid black;" ng-repeat="row in [1,2,3]">{{$index}}</div> 
       </div> 
      </div> 
     </div> 
    </script> 

    <form-table table-layout=tableLayout|filter:{table_id:1}></form-table> 
</div> 


var app = angular.module('myApp', ['ngMaterial']); 
app.controller('mainCtrl', function($scope) { 
    $scope.tableLayout =[{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"0","element_name":"Action Reference","sort_order":"0","is_multirow":"1","flex":"30","element_sort_order":"4","is_show":"0"},{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"1","element_name":"Audit Criteria","sort_order":"0","is_multirow":"1","flex":"30","element_sort_order":"0","is_show":"1"},{"head_id":"GAP Assessment","table_id":"1","table_name":"GAP Table","element_id":"3","element_name":"Document Reference","sort_order":"0","is_multirow":"1","flex":"10","element_sort_order":"3","is_show":"1"}] 
}); 
app.directive('formTable', function() { 
    return { 
     scope:{tableLayout:'&'}, 
     link: function(scope,element,attrs){ // normal variables rather than actual $scope, that is the scope data is passed into scope 

        scope.column=scope.tableLayout(); 
        scope.testFn=function(){ 
         console.log(scope.tableLayout()); 
        } 



        //function and scopes go here 
       },//return 
     transclude:true, 
     templateUrl: '/template', 
     restrict: 'E'   
    } 
})

来源

2015-11-15 Ka Tech

只要我张贴了这个问题，我发现我的问题 - 需要使用车把！

flex = "{{col.flex}}"

现在的作品。

Working Fiddle

来源

2015-11-15 04:21:07

ng-repeat元素中的角度材料弯曲

回答

相关问题