問題タブ [ui-select]

私はAngularJSの初心者です。車のメーカー、モデル、年のネストされたリストを取得する API 呼び出しを行うアプリがあります。呼び出しの結果を表示する 3 つの ui-select 要素を作成しました。まず自動車メーカーのリストから始めて、そのメーカー内のモデルに絞り込み、最後にそのモデルの年数を絞り込みます。ユーザーが車のモデルの入力を開始できないように、空の場合は 2 番目と 3 番目の選択を無効にしたいと思います。

これは、 Angular ui-select プレースホルダーが ng-model の初期化時に機能しないことに基づいて、各選択が空かどうかを判断しようとしている方法です

無効になっている入力はありません。

以下を使用して、サーバー データに基づいていくつかの ui-select ドロップダウンを作成しました。各ドロップダウンから独立した項目を選択するのが好きです。1 つのドロップダウンで項目を選択すると、すべてのドロップダウンに同じ値が割り当てられます。選択した値を分離するにはどうすればよいですか?

これがスクリーンショットです。3 つのすべてのドロップダウンには、異なる値のセットがあります。

私は ui-select を使用しています。Enter キーを押して検索結果を選択すると、結果が選択され、フォームが直接送信されます。私はそれを理解できません、何が問題なのですか。

ここに私が使用しているHTMLがあります

私が取り組んできた問題：

元の問題 (一方向バインディングのみに対処) は、ここで見つけることができます: コントローラからディレクティブに ngModel を渡す/更新できません

ディレクティブ内からビューへの一方向バインディングを取得することができました。しかし、たとえば、ページの読み込み時に選択をプッシュしたい場合、双方向バインディングを機能させることができません。最初のディレクティブ内の ng-model がデータを取得していることがわかりますが、子ディレクティブでさまざまなスコープ設定を試してみましたが、それが壊れるか、以前と同じことをします-何もしません。

ビューで ng-model にアタッチされたバインディングに単純なオブジェクトをプッシュすると、ウォッチャーは $viewValue をディレクティブのスコープ オブジェクトに割り当てるように、基本的な$watch関数をセットアップしました。それはこれを行い、ui-select に割り当てられた ng-model バインディング内のオブジェクトをはっきりと見ることができますが、ディレクティブは既存の選択を一掃することによってのみ応答します。

ウォッチ機能は次のとおりです。

この関数を使用して、ui-select を操作するたびにビューを更新します (正常に動作します)。

いじくり回し用プランカー

したがって、予想される動作は次のとおりです。

• ui-select からの選択は select に表示され、ビューにも渡されます
• 「変更」ボタンをクリックすると、データがビューに表示され、ui-select に渡されます。

エラー: [ngRepeat:dupes] リピーターでの重複は許可されていません。'track by' 式を使用して一意のキーを指定します。リピーター: $select.selected の $item、重複キー: 番号:1、重複値: 1

複数のビューを持つ複雑なページを作成するために ui-select を使用しています。ユーザーがタブ (または私の場合はドロップダウン) を選択すると、各ビューが ajax を介して読み込まれることを知らない人のために。ビューには従来、独自のコントローラーと HTML テンプレートがあります。ビューは、表示されている親ページのスコープを継承しますが、独自の子スコープを持ちます。

私の場合、一部のビューにはコントローラーがまったくありません。それらは非常に単純なので、html ページしかありません。問題は、親ページのスコープの構成オブジェクトでブール値を切り替えて、親ページのいくつかのコントロール フィールドをオフにできるようにしたいということです。すべてが既に存在し、複数のページがこれらのビューを使用しています。単にそれらを展開して、親の何かを切り替えたいだけです。

これには 3 つの方法があります。私は自分のui-routerでresolveメソッドを使用して、ビューがロードされたときに必要なフィールドを明示的に切り替えることができましたが、各ページの各ui-routerでこれを明示的に行う必要があります。クールなコードの再利用はありません。

現在コントローラーがない場合、ui-routerにコントローラーをロードさせることができ、コントローラーはこれを実行できます。ただし、これは、ビューを使用するすべての場所でほとんど不要なコントローラーを手動で追加することを意味し、コードの再利用のようには感じません。

または、ng-init を使用して、読み込み時に必要な値をビューに明示的に設定することもできます。私はまだコントローラーを持っていないので、これが最もクリーンで簡単だと感じます。

ただし、ng-init は眉をひそめられており、おそらくエイリアシングにのみ使用する必要があります。ng-init を使用するよりもクリーンなアプローチはありますか? コントローラーのないビューを持つのは本当に悪いことですか (より正確には、親コントローラーはまだありますが、新しいビューが開いたときに再ロードされません)。

ui-select の選択肢の配列と、もう 1 つのカスタム項目を表示する必要があります。このカスタム項目を現在のディレクティブに追加するにはどうすればよいですか? このカスタム アイテムを表示するための UI が異なるため、このカスタム アイテムを配列に挿入できません。