如何使用angularjs在html表中动态加载嵌套数组属性?

这是我尝试的代码,但是只有cardno和cardtype的值,为什么我无法访问其余的值?有什么建议吗?

<tr ng-repeat="data in myData17.layouts">
  <td ng-show="$index==1">{{data.name}}</td>
  <td ng-show="$index==1">
    <table>
      <tr ng-repeat="card in data.cards">
        <td>{{card.cardNo}}</td>
      </tr>
    </table>
  </td>
  <td ng-show="$index==1">
    <table>
      <tr ng-repeat="card in data.cards">
        <td>{{card.cardType}}</td>
      </tr>
    </table>
  </td>
  <td ng-show="$index==1">
    <table>
      <tr ng-repeat="card in data.cards.ports">
        <td>{{card.portNo}}</td>
      </tr>
    </table>
  </td>
  <td ng-show="$index==1">
    <table>
      <tr ng-repeat="card in data.cards.ports">
        <td>{{card.portName}}</td>
      </tr>
    </table>
  </td>
  <td ng-show="$index==1">
    <table>
      <tr ng-repeat="card in data.cards.ports">
        <td>{{card.portType}}</td>
      </tr>
    </table>
  </td>
  <td ng-show="$index==1">
    <table>
      <tr ng-repeat="card in data.cards.ports">
        <td>{{card.portspeed}}</td>
      </tr>
    </table>
  </td>
  <td ng-show="$index==1">
    <table>
      <tr ng-repeat="card in data.cards.ports">
        <td>{{card["ds-scheduler-node-profile"]}}</td>
      </tr>
    </table>
  </td>
</tr>

这是我的数据。

      {
  "name": "twoCardOneEthportAndOne10G","cards": [{
    "cardNo": "1","cardType": "Ethernet","ports": [{
      "portNo": "1","portName": "LAN1","portType": "ethernetCsmacd","portspeed": "eth-if-speed-1gb","ds-scheduler-node-profile": "default"
    }]
  },{
      "cardNo": "10","ports": [{
        "portNo": "1","portName": "10GE","portspeed": "eth-if-speed-10gb","ds-scheduler-node-profile": "default"
      }]
    }]
}
heishashengzhe1 回答:如何使用angularjs在html表中动态加载嵌套数组属性?

data.cards.ports 无关紧要。

端口属性是单个,而是一个数组。

必须像这样访问它:

data.cards[0].ports

那么,这在您的代码中将如何组织?您将需要这样的东西(这不是您的确切实现的解决方案,只是一个直观的指南,可以帮助您以所需的方式访问数据)

<div ng-repeat=“data in myData17.layouts”>
    {{ data.name }}
    <div ng-repeat=“card in data.cards”>
        {{ card.cardNo }}
        <div ng-repeat=“port in card.ports”>
            {{ port.portNo }}
        </div>
    </div>
</div>

希望这能给您带来更好的理解和好运

本文链接:https://www.f2er.com/2853612.html

大家都在问