AngularJSを初めて使用し、ng-if条件が評価される前にHTMLコードの一部が表示される問題を修正しようとしています。私は多くの他のスタックオーバーフローURLで言及されているようにng-cloakをhsingしていますが、それでも私のためには機能しません。 URLの実際のイメージが空白で、ページが読み込まれたときに実際のURLがある場合でも、デフォルトイメージを読み込もうとしています.ng-cloakが正しく動作しないため、デフォルトイメージで最初に点滅し、実際のイメージを読み込みます。ページロード時にng-cloakが動作しない
助けてください。
は、私はあなたがあなたのbody
タグでng-cloak
を適用することができますなど
Index.htmlと
<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8">
<base href="/">
<title>Some App</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-resource.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-route.min.js"></script>
<script src="https://code.angularjs.org/1.4.7/angular-sanitize.min.js"></script>
<style type="text/css">
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
</style>
</head>
<body ng-app="app">
some code here
<div ng-view></div>
</body>
</html>
other.html
<div class="content">
<div style="width: 100px; height: 40px;">
<div ng-if="image.small">
<img src="{image.small}}">
</div>
<div ng-if="!image.small" ng-cloak>
<img src="image/default.png">
</div>
</div>
あなたは答えてくれてありがとう、ngIf –
@ItaloAyresを使用しないようにのようなものを使用することができますが、image.smallがチェックよりも、存在しない場合のように、私は複数の条件を使用する必要がありますimage.largeの場合は、それがデフォルトのイメージを読み込むよりもない場合。あなたが示したこの状態を使ってどうすればいいのか分かりませんので、このためにng-ifを使ってみました。 – ree
||を使用しています代入では、最初の非NULL値を返すJS式です。次のような変数をいくつでも使用できます。X = a || b || c、およびXは、nullでない値を持つ最初のものを受け取ります。 –