2

http://plnkr.co/edit/GQ40yelDbLMpRyZqYpNB?p=preview

またはその他のNG

上記の私の例では、いくつかのビットコイン トランザクションを含むモデルがあり、いくつかは着信トランザクションであり、いくつかは発信トランザクションであり、どちらも異なるアイコンを持っています。

vm.transactions = [
  {
    type: 'incoming',
    comment: 'Recieved from multiple addresses',
    time: '10 hours ago',
    amount: 0.00498623
  },
  {
    type: 'incoming',
    comment: 'Recieve from 1MgZLyz6d8djEqe68XoPpsjx9BFQyVAtXN',
    time: '12 hours ago',
    amount: 0.003
  },
  {
    type: 'outgoing',
    comment: 'Sent to 17dPAMzZiosQYVty6ES4KSWN8R8XFcxShH',
    time: 'Jan 15th 2015',
    amount: 0.01
  },
  {
    type: 'incoming',
    comment: 'Recieved from multiple addresses',
    time: 'Jan 14th 2015',
    amount: 0.02874
  },
  {
    type: 'outgoing',
    comment: 'Sent to 1GS9E86Y3mhK7Qwm1vqvgCmpE5u6MMxPML',
    time: 'Jan 12th 2015',
    amount: 0.064904
  }
];

ng-switchに関するこれらのドキュメントを見つけました

使用法

<ANY ng-switch="expression">
  <ANY ng-switch-when="matchValue1">...</ANY>
  <ANY ng-switch-when="matchValue2">...</ANY>
  <ANY ng-switch-default>...</ANY>
</ANY>

これは私が現在試していることですが、アイコンが表示されません:

<tr class="row_body"
    ng-repeat="trans in transactions">

    <td class="td_icon" ng-switch="{{trans.type}}">
        <div ng-switch-when="incoming" class="icon-download">↓&lt;/div>
        <div ng-switch-when="outgoing" class="icon-upload">↑&lt;/div>
    </td>
    <td class="td_comment">
        {{ trans.comment }}
        <p class="date">{{ trans.time }}</p>
    </td>
    <td class="td_amount green">{{ trans.amount }}</td>
</tr>

ここに画像の説明を入力

私が間違っているところがわかりますか？またはng、使用する必要がある別のものがありますか？

4

2 に答える 2

5

変化する

<td class="td_icon" ng-switch="{{trans.type}}">

に

<td class="td_icon" ng-switch="trans.type">

この用語expressionは、角度のあるドキュメントでは時々混乱することがあります

ワーキングプランカー

于 2015-01-22T02:40:24.540 に答える
3

この行の中括弧を削除します (angular は an の値を評価ng-switchします):

<!-- before -->
<td class="td_icon" ng-switch="{{trans.type}}">

<!-- after -->
<td class="td_icon" ng-switch="trans.type">
于 2015-01-22T02:41:03.947 に答える