問題タブ [md-autocomplete]

マルチセレクターとして Angular Material で md-autocomplete を使用しようとしています。アイデアは、オートコンプリートから選択された要素が選択後にオブジェクト配列に追加され、選択が md-autocomplete から削除されるということです。md-autocomplete をクリアできましたが、フォーカスは md-autocomplete 入力にとどまっているため、オートコンプリートの提案は引き続き表示されます。例: http://cdpn.io/QjQGVQ

コード：

PS: 代わりに Angular Material のコンタクト チップを使用できることは承知していますが、ぼかしをどのように実現できるかまだ疑問に思っていました。

md-autocomplete でぼかしイベントを使用したいのですが、ng-blur と md-blur の両方が機能しません。

ユーザーに md-autocomplete のドロップダウン リストで項目を選択してもらいたい。テキストを入力しても選択されていない場合、入力フィールドはフォーカスを外した後にクリーンになります。理想的な私を助けてください。

md-autocompleteをAlgolia の Angular serviceとうまく連携させようとしています。アルゴリアから返された結果を表示するドロップダウンを取得することに固執しています。コンテンツはコンソールにありますが、ドロップダウンには更新された結果が入力されません。私は何が欠けていますか？

tl;dr: Plnkr

「バックエンド」

"フロントエンド"

「アルゴリアデフォルト」

Web サイトで angular material のオートコンプリート コンポーネントを使用しようとしています。

私が持っているHTMLコードで：

私のコントローラーには次のものがあります：

ご覧のとおり、あまり実装していません。ただし、オートコンプリートが何かを見つけようとしている場合は、getMatches を実行してテキストに警告する必要があります。

私のシナリオでは、「一致が見つかりませんでした」と出力する以外は何もしません。

検索するテキストを入力するテキスト入力はありません。

私は何が欠けていますか？

https://jsfiddle.net/p7wc8psy/のjsfiddle

初めてAngularマテリアルを使用しています。オートコンプリートの問題で立ち往生しています。以下は私のテンプレートです：

そしてctrlには次のものがあります：

上記のコードでは、提案として何も得られず、見つからないテキストのみが表示されますが、http 呼び出しはコンソールにも出力される配列を返します。私は何かが欠けていますか??

多くの場所で、人々がオートコンプリートでいくつかのフィルターを使用しているのを見ましたが、それは不可欠なものだとは思いません。

上記の作業を行う方法を教えてください。

md-autocomplete は、ドロップダウンに存在しない要素を検索しようとすると、md-virtual-repeat-container に md-not-found という名前のクラスを提供し、その下にエラー メッセージを表示します。入力要素からフォーカスを外すと、md-not-found が削除されます。したがって、オートコンプリートは、ユーザーにフィードバックが表示されないため、有効な入力があるという誤った印象を与えます。

入力要素のフォーカスを外した後でも、クラス「md-not-found」を維持する方法はありますか?

md-autocomplete 公式デモ: https://material.angularjs.org/latest/demo/autocomplete

アップデート

私は一時的な解決策を作りました：

label-error クラスは赤色を適用します。

解決策は、質問自体に対する回答ではありませんが、代替の迅速な修正を提供します

クロム拡張機能でオートコンプリートの提案を入力したい。私は非常に奇妙な問題に直面しています。

入力に焦点を当てると、提案メニューは適切な値で適切に開かれますが、他の場所に焦点を合わせると、提案メニューが非表示になることはなく、最初の入力の下に空の提案メニューが開いていることがわかります。それは決して自分自身を隠すことはありません。

他のすべての機能は正常に動作しています。

私は効果なしでこれを試しました: Angular Material: md-autocomplete - Enter イベントで md-autocomplete-suggestions を非表示にする方法は?

これが私のhtmlです：

そして私のJSコード：

Chrome拡張機能にあるため機能しないのではないかと自問していますが、見た目がシンプルすぎます...

明確にするために私の問題の写真：

誰かが理由を知っているか、同じ間違いをしてくれたらありがとう!

マット。

のディレクティブを作成しようとしていますmd-autocomplete。AngularJSが提供する回答を使用してみました- ng-model を使用するディレクティブを作成しますが、うまくいきません。

私の CodePen はここにあります: http://codepen.io/colbroth/pen/QyMaQX/?editors=101。

このコードは、 https: //material.angularjs.org/latest/demo/autocomplete にあるオートコンプリートの Angular マテリアル デモに基づいています。複数のページがあり、州を選択するためのオートコンプリート フィールドが必要です。Web ページ コンポーネントごとにコードを繰り返したくありません。

state-directiveどちらの場合も同じ値を反映する状態がmd-autocomplete必要です。demoCtrl.selectedしかし、入力要素を更新すると、state-directiveこれが反映されず、その逆も同様です。

<input ng-model="demoCtrl.selectedState">

<state-directive ng-model="demoCtrl.selectedState">...</state-directive>

そのため、AngularJS アプリケーションに Angular Material Design の md-autocomplete ディレクティブを実装しています。コントロールに promise を送信して、クエリが完全に読み込まれていない場合でもエラーをスローしないようにしたい。また、コントロールのローディングバーを「ローディング」の合図として見ることもできます。

これは、データの読み込みが完了していないときに発生するエラーです。

TypeError: 未定義のプロパティ 'slice' を読み取れません

これは私がデータを取得する方法です：

これが私のhtmlです：

クエリを処理する関数は次のとおりです。

ありがとう！