20

オブジェクトのセーフ ナビゲーション オペレータを使用して非同期呼び出しをロードしましたが、これは非常に素晴らしいことです。配列でも同じことを再現できると思っていましたが、Angular コードにテンプレート解析エラーが表示されます。別の解決策であることは知って*ngIfいますが、安全なナビゲーション演算子のように、より簡単な (コードによる) 方法はありますか?

<div class="mock">
   <h5>{{data?.title}}</h5>  //This works
   <h6>{{data?.body}}</h6>  //This works
   <h6>{{simpleData?[0]}}</h6>  // This is what I tried to implement    
</div>
4

4 に答える 4

15

配列で使用できる安全なナビゲーション演算子のようなものはありますか?

はい、あなたが探しているのはOptional Chaining operator ( JavaScript / TypeScript ) として知られています。

MDN JavaScript ドキュメントに示されている構文は次のとおりです。

obj.val?.prop
obj.val?.[expr]
obj.arr?.[index]
obj.func?.(args)

したがって、目的を達成するには、例を次のように変更する必要があります。

<h6>{{simpleData?[0]}}</h6>

に：

<h6>{{simpleData?.[0]}}</h6>
                 ^

Typescriptでオプションのチェーンを配列で使用する方法も参照してください。.

于 2021-01-29T14:35:01.263 に答える