AngularJS の無効な URL によって引き起こされる背景画像エラーを防ぐ方法は?

AngularJS での無効な URL による背景画像エラー

AngularJS では、ng-src タグにより、動的変数を含む URL が Angular で評価される前にエラーが発生しないことが保証されます。ただし、background-image:url(...) を使用して背景画像を設定するときに、同様のエラーがよく発生します。

これは、Angular が CSS スタイルの変数を評価しないために発生します。したがって、背景画像に動的 URL を使用すると、特にこの構成で複数の DIV がある場合に、大量のエラーが発生する可能性があります。

解決策: Angular スタイル バインディング

この問題を解決するには、Angular のスタイル バインディング機能を使用できます。

<li ng-style="{'background-image':'url(/static/'+imgURL+')'}">...</li>

Angular スタイル バインディングで動的 URL を中括弧で囲むことにより、Angular は変数の評価後に URL が更新されるようにし、エラーを解決して防止します。壊れた画像のリクエスト。

以上がAngularJS の無効な URL によって引き起こされる背景画像エラーを防ぐ方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。