問題タブ [md-autocomplete]

ユーザーが入力をクリックして esc キーを押すと、提案ドロップダウンが消えます。その後、奇妙なプログレスバーが循環し続けます..この機能を無効にする必要があります

md-autocomplete をビルドしたいのですが、オプションを表示できません。挿入された入力のオプションがない場合にのみ起動されるエラー メッセージを常に表示します。
私のサービスは正しく戻り、コントローラーはサービス データの受信後にのみ戻ります。

HTML:

コントローラ：

サービス：

コントローラーに返される結果の例は次のとおりです。

私の例 ( https://jsfiddle.net/vv18yjzo/7/ ) では、md-chips 入力がフォーカスされている限り、オートコンプリートの提案が表示されます。これは、いくつかの項目を入力するときにうまく機能します。ただし、使用可能なすべてのアイテムが追加されてから削除されると、オートコンプリートの提案は空または非表示になります。オートコンプリートの候補を再度表示するには、新しい検索テキストを入力する必要があります。

HTML:

JS:

例: https://jsfiddle.net/vv18yjzo/7/

たとえば、ユーザーの入力を10個の数字のみに制限/制限する動作を実現したいと思います:

誰でもこれを行う方法を知っていますか?

それらには属性 md-input-maxlength があることがわかりますが、それを機能させることも、例を見つけることもできません。

あなたの意見に感謝します。

必要な属性を持つ md-autocomplete ディレクティブがあります。予想される動作は、ユーザーがフォーム ビューに入ったときに ng-message が非表示になることです。次に、送信ボタンをクリックしてオートコンプリートが空であるか、入力を開始して空白のままにすると、検証エラーが表示されます。

検証は正常に機能しますが、ユーザーがオートコンプリートから提案を選択すると、検証エラーが一時的に表示され、gif で確認できるように非表示になります。

angular-material 1.0.9 を使用します。

md-autocomplete のコード:

この問題を回避する方法はありますか?

私はmd-autocompleteAngular Materialから使用しています：こちら

ドロップダウンの幅は入力フィールドの幅と一致しているようです。アイテムのテキストが長すぎる場合は、ellipsis.

ただし、入力フィールドの幅を比較的短く保ちながら、アイテムの全文を表示したいと考えています。つまり、ドロップダウンの幅はそのコンテンツに合わせて拡張する必要があります。

の要素のスタイルを調べてみましmd-autocompleteたが、うまくいくスタイルが見つかりませんでした。何か案が？

編集：

私が最終的に持っていたスタイルは次のとおりです。

ただし、もう 1 つ問題があります。はoverflow-y:scroll、必要がない場合でも常に垂直スクロール バーを表示します。に変更するとoverflow-y:auto、存在する場合の垂直スクロール バーが作成されますellipsis。これを解決するにはどうすればよいですか？

角度のある素材のオートコンプリートを、要件ではなく提案のリストにしたい。ただし、Angular Material docs の明確な例ではないため、実装方法がわかりません。

以下の例では、私のモデルは$ctrl.item.category

私のモデルは にリンクされているため、以下の例は明らかに間違っていますがmd-selected-item、これはアイテムを選択した場合にのみ機能します。アイテムがリストにない場合、ユーザーがテキストを自由に入力できるようにしたい。基本的に、オートコンプリートはほとんどのブラウザーで既に機能しています。

これを無効にする方法について多くの質問がありますが、アイテムが選択されていないときに残ったテキストをクリーンアップするほど無効にしようとはしていません。このような場合、項目が選択されていない場合、モデル値はnullになりますが、テキストは入力に残されます。

人が選択しない場合（または一致しない場合）、入力されたテキストをモデル値にする必要があります。

私のオプション ( $ctrl.categories) は文字列の配列であり['Food','Liqour']、ユーザーがそれらのいずれかを使用できるようにするか、自由に入力できるようにしたいと考えていますTables。

設定するフィールドがほとんどないダイアログがあります。最初のフィールドは です。md-autocomplete[OK] をクリックすると、これらのフィールドはすべてmd-autocomplete消去されます。データの入力を再開するために、 でフォーカスを true に設定します。

ビュー内のオートコンプリート フォーム フィールド:

JS コード

上記のスニペットから、md-autocomplete フィールドの都市コードのカスタム エラー メッセージを作成しようとしています。私は都市コードの配列を持っているので、ユーザーが私が持っているコードのリストにない無効な都市コードを故意に入力すると、「無効な都市コード」というメッセージを表示したかった

コードが機能していないことがわかりました。カスタム関数 (ディレクティブ内) がトリガーされたかどうかを確認するためだけに、毎回カスタム検証関数から true を返すように強制しました。結果が表示されません。