如何从Array中的Array绘制AngularJs表

如何从Array中的Array绘制AngularJs表

function MyCtrl($scope) {
  $scope.items = [1, 2, 3, [4, 5, 6]];
}

td, th {
  border: 1px solid black;
  width: 60px;
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="">
  <div ng-controller="MyCtrl">
    <h4>This is what I want to make but Data is [1, 2, 3, [4, 5, 6]]</h4>
    <table>
      <tr>
        <th ng-repeat="item in [1, 2, 3, 4, 5, 6]">head - {{item}}</th>
      <tr>
    </table>
    <h1>This is what I have tried</h1>
    <table>
      <tr>
        <tr ng-repeat="item in items">
          <th ng-show="isNan(item)" ng-repeat="head in item">{{head}}</th>
          <th ng-hide="isNan(item)">{{item}}</th>
        </tr>
      <tr>
    </table>
  </div>
</div>





如果您对此有任何想法,请帮助我。

原始逻辑就是这样。

每个用户都有其信息。如名称,密钥,密码。并且也有设施。每个设施都有其选择。类型,颜色等

我想在一排显示用户信息。

为此,我需要在一行中列出所有信息键。

[4,5,6]是设施,用户可以拥有多个设施。

有人遇到过这个问题吗?

最佳答案

尝试包括一个名为LoDash的库,并在项目数组上调用_.flattenDeep方法。然后它应该按预期工作。



function MyCtrl($scope) {
  $scope.items = [1, 2, 3, [4, 5, 6]];
  $scope.items = _.flattenDeep($scope.items);
}

td, th {
  border: 1px solid black;
  width: 60px;
  text-align: center;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/lodash.min.js"></script>
<div ng-app="">
  <div ng-controller="MyCtrl">
    <table>
      <tr>
        <th ng-repeat="item in items">head - {{item}}</th>
      <tr>
    </table>
  </div>
</div>

关于javascript - 如何从Array中的Array绘制AngularJs表?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47065207/

10-12 13:30