AngularJSのHTMLバインド {{expression}} ではundefinedを気にしない


Forgiving

AngularJS: Expressions ページで Forgiving として説明されているように、HTML(テンプレート)で記述する AngularJS のバインド部分({{ result.title.value }}ng-if=“result.tags.length”)では、result、title、tags が、undefined や null でないかや object かどうかということを考慮したコードにしなくていい。

result が通信してサーバから取得するデータであれば、レスポンスが返るまでの間 result は undefined の状態になるけど、だからと言って{{ ((result || {}).title || {}).c }}とか、result && result.title && result.title.valueのようにコーディングしなくていい。

サンプル

以下のサンプルでは、ng-hide="result.hidden"のとこで、result なんて定義してないので undefined だけど、エラーにならずに falsy として扱われている。

JS Bin