web-dev-qa-db-ja.com

Angular ng-if change span text

私はオブジェクトを製品として取得しているこのJSONファイルを持っています。 jsonオブジェクトに "kids"： "1"がある場合、スパンを "sizes："から "kids："に変更したい製品のサイズを表示するとき。

<div class="sizes-wrap">
        <span class="size-label"><span>sizes:</span>
        <span class="sizes">{{ item.sizes }}</span>
</div>

このコードはSizes：とjsonからのサイズを出力します。 「128 cm、140 cm、152 cm、164 cm」

Jsonオブジェクトの "kids"の値が1の場合、htmlでWordの "sizes"を "kids"に変更します。

<div class="sizes-wrap">
        <span class="size-label"><span>kids:</span>
        <span class="sizes">{{ item.sizes }}</span>
</div>

ここにjsonオブジェクトの1つがあります：

  "kids": "0",
  "name": "Product name",
  "sizes": "Small,Medium,Large,X-Large,XX-Large,3XL",
  "kid_adult": "0",
  "free_porto": "0",
  "price": "649,00",
  "package": "0",
  "delivery": "1-2 dage",
  "price_old": "0,00",
  "id": "133714",
  "women": "0"

これは結局私が達成したかったことです：

<div class="sizes-wrap">
        <span ng-if="item.kids == 0 && item.kid_adult == 0 && item.women == 0" class="size-label"><span>sizes:</span></span>
        <span ng-if="item.kids == 1" class="size-label"><span>kids:</span></span>
        <span ng-if="item.kid_adult == 1" class="size-label"><span>adult kids:</span></span>
        <span ng-if="item.kid_adult == 1" class="size-label"><span>women:</span></span>
        <span class="sizes">{{ item.sizes }}</span>
    </div>
htmlcssangularjsangular-ng-if
9
user1780729

これはあなたのために働くはずです：

<div class="sizes-wrap">
    <span class="size-label">
        <span ng-if="item.kids == 0">sizes:</span>
        <span ng-if="item.kids == 1">kids:</span> 
    </span>
    <span class="sizes">{{ item.sizes }}</span>
</div>
4
keithm

JavaScript式では、この場合は三項演算子を使用します。

<span>
    {{ user.biography ? user.biography : 'Without information' }}
</span>
4
uruapanmexicansong
 <span ng-if="data.kids === 1">kids:</span>
 <span ng-if="data.kids !== 1">sizes:</span>

たぶん、このように、jsonでWordを送信し、次のように挿入する方が良いでしょう。

<span class="size_Word">{{data.size_Word}}</span>
2
Dmitry Lobov