問題タブ [angularjs-ng-if]

ビューファイルには次のものがあります。

を選択するtab1と、情報が正しく表示されます。ただし、 をオンtab2にすると、両方のスパンの要素が表示されているように見えます。に関連する要素<p>には空の値が表示されます。DOM ツリーを見ると、 on のときに条件が表示されていないようにも見えます: 。問題がどこにあるのか誰にもわかりますか? さらにコードが必要な場合はお知らせください。<p>tab1tab2ng-if<!-- end ngIf: currentTab == 'tab2' -->

検索フィルターをサポートする小さなプロジェクトに取り組んでいます。製品名、ステータス、日付など、ユーザーが選択できるデフォルトの選択ドロップダウンがあります。これらのオプションは、次に表示または置換するフォームのタイプを決定します。

ユーザーが製品名を選択すると、別のドロップダウンが表示され、Equals や Not Equals などのオプションと入力フィールドが表示されます。

ユーザーが [日付] を選択すると、別の選択ドロップダウンが表示され、[より小さい]、[より大きい]、[次の間] などのオプションが表示されます。より大きいオプションとより小さいオプションの場合、日付ピッカーが表示されます。ユーザーが [Between] を選択すると、開始日用と終了日用の 2 つの日付ピッカーが表示されます。

ng-ifこれまでのところ、例やなどのロジックでビューを肥大化させることで、この問題を解決しました||。

別の方法が必要であることはわかっていAngular wayます。

ここに私が現在持っているコードがあります。productsFormFilterBuilderCtrlフォームを動的に構築するコントローラーがあります。

});

次に、選択ドロップダウンが を使用して作成される HTML テンプレートがありますng-options。このビューは、特定のフォームを表示するためのロジックで非常に肥大化しています。たとえば、単一の日付ピッカーと 2 日間のピッカーです。

これは、添付の画像に示すように、フォーム要素の追加/削除、または追加されたすべてのフォーム要素の削除もサポートします。ヒント/提案は大歓迎です。私のUIビュー

サイド ナビゲーション メニューを構築しようとしていますが、DOM の状態 (つまり、DOM 内) に基づいて項目を動的に<section>設定したいと考えています。

ただし、AJAX ( ) を介して取得されるスコープ変数に基づくng-ifさまざまな に適用されるがいくつかあります。そのため、ディレクティブがコンパイル (またはリンク) されたとき、これらのスコープ変数はまだ取得されておらず、はまだ安定していません (変数が であるかのように評価されます)。<section>$http.getng-ifundefined

メイン HTML

サイドナビ HTML

ディレクティブの定義

式が安定化された後 、ページ上の DOM 要素にアクセスする最良の方法は何ですか? ng-if私は考え$timeoutていましたが、「安全な値」が何であるかは本当にわかりません.

または、どういうわけか使用できますか/使用する必要があります$watchか? ctrl.sections動的に更新する方法はありますか?

4 つの条件で角度を記述する必要がありng-switchます。

SO に関する他の回答の中には、ng-ifの代わりに使用することをお勧めするものがありng-switchます。

で試してみましたがng-if、これが最善の方法だとは思いません。その理由を説明します。

基本的に、スコープ内にあるいくつかの変数に応じて、3 つの異なるアイコンを表示する必要があります。

私のテンプレートのコードは次のとおりです。

さて、私には、これは本当に面倒に見えます。また、すべての if ステートメントを繰り返し処理して true を出力するため、期待どおりに機能しません。

代わりに次のようなことをすることは可能ですか?

または、このタイプのテンプレートを適切に処理する方法について他に何か提案はありますか?

質問が十分に明確であることを願っています。

助けてくれてありがとう

ng-if により、読み込み時にページのリンクが表示され、その後消えることがあります。

リンクはまったく表示されないはずです.ng-ifステートメントは、私が見ることができた瞬間にはまだ処理されていないと思います.

リンクまたは要素がまったく表示されないようにする方法はありますか?

また、 currentClass オブジェクトがまだロードされていないため、ng-if を評価できないと推測していますが、ng-if が解決できるまでデフォルトで非表示にしようとしています。

私はJavaScriptとAngularJSが初めてです。問題をキャッチします。/main ルートに移動するときに h1 タグを削除したい。at コントローラーで ng-ifand 式を使用する必要があることはわかっています。$location

これを削除するために使用する必要がある式、または確認するためにコントローラーに関数を記述する必要があります。よろしくお願いします