[解決済み] AngularJS: ng-show / ng-hide が `{{ }}` 内挿で動作しない。
2022-04-19 16:03:06
質問
を使用して、いくつかのHTMLを表示/非表示にしようとしています。
ng-show
と
ng-hide
が提供する機能
アンギュラーJS
.
ドキュメントによると、これらの関数のそれぞれの使い方は以下の通りです。
<ブロッククオートngHide - {式}. - 式が真であれば、その要素をそれぞれ表示または非表示にします。 ngShow - {式}. - 式が真であれば、その要素はそれぞれ表示または非表示にされます。
これは次のような使用例で機能します。
<p ng-hide="true">I'm hidden</p>
<p ng-show="true">I'm shown</p>
しかし、オブジェクトのパラメータを式として使用する場合は
ng-hide
と
ng-show
には、正しい
true
/
false
を返しますが、値はブーリアンとして扱われないので、常に
false
:
出典
<p ng-hide="{{foo.bar}}">I could be shown, or I could be hidden</p>
<p ng-show="{{foo.bar}}">I could be shown, or I could be hidden</p>
結果
<p ng-hide="true">I should be hidden but I'm actually shown</p>
<p ng-show="true">I should be shown but I'm actually hidden</p>
これはバグか、私のやり方が悪いかのどちらかです。
オブジェクトのパラメータを式として参照することに関する相対的な情報が見つからないので、AngularJSをより理解している人が私を助けてくれるかもしれないと期待しているのですが?
どのように解決するのですか?
その
foo.bar
の参照は中括弧を含んではいけません。
<p ng-hide="foo.bar">I could be shown, or I could be hidden</p>
<p ng-show="foo.bar">I could be shown, or I could be hidden</p>
アンギュラー 表現 は中括弧で囲む必要がありますが、Angular では ディレクティブ はありません。
参照 Angularのテンプレートを理解する .
関連
-
[解決済み】TypeError: window.initMap is not a function
-
[解決済み] `ui-router` $stateParams vs. $state.params
-
[解決済み] ページロード時にAngularJSのコントローラ関数を実行する方法は?
-
[解決済み] Angular ng-repeatの条件付きラップアイテム(ng-repeatのグループアイテム)。
-
[解決済み] シンプルなangularjsの日付入力
-
[解決済み] angularjsでチャートを作成する【終了】。
-
angularでのng-repeatとtrack by
-
[解決済み] AngularJS コントローラにおける 'this' と $scope の比較
-
[解決済み] AngularJSでチェックボックスの値のリストにバインドするにはどうすればいいですか?
-
[解決済み] AngularJSで独自のスコープ*を持つカスタムディレクティブ内から親スコープにアクセスするにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】TypeError: window.initMap is not a function
-
[解決済み】Angularjs accordion ng-click on panel-header
-
[解決済み] X-Frame-Options'を'SAMEORIGIN'に設定しているため、フレーム内での表示を拒否された。
-
[解決済み] 'ApplicationSignInManager' が見つからない(ASP.NET MVC)
-
[解決済み] angularjsで$compileを操作する
-
[解決済み] controllerAs "プロパティを使用する理由は何ですか?
-
[解決済み] createspyとcreatespyobjの違いは何ですか?
-
[解決済み] angular.serviceとangular.factoryの比較
-
[解決済み] コントローラでフィルタを使用するには?
-
[解決済み] ServiceとFactoryで迷う