Angular.js: 値をクリアすると、数値入力フィルターが機能しなくなります

作成日 2014年11月26日  ·  5コメント  ·  ソース: angular/angular.js

数値入力値をクリアする(空にする)場合、理想的にはフィルターを適用せず、すべての値をリストする必要があります。 現在、入力ボックスに5を入力してフィルターを適用すると、正常に機能し、5に一致するすべてのデータが一覧表示されます。 ここで、入力ボックスの値をクリアすると、理想的にはすべての値がリストされます(フィルターなし)が、angularは数値にnullフィルターを適用し、すべてがフィルターで除外されます(ng-repeatは何もリストしません)。

input type = "number" ng-model = "age"

フィルター:年齢

注:type = textinputに問題はありません

forms low confusing bug

最も参考になるコメント

(あなたが言ったように)これは、フィールドが空のときにinput[number]がモデルにnullを割り当てるために発生します。

これが期待どおりに機能することを期待するのは合理的ですが(imo)、どうすればこれに対処できるかわかりません。
nullは検索するのに有効な値である可能性があるため、フィルター側で修正することは望ましくありません(また、未定義として扱うことはできません)。 NgModelControllerそれを修正することも、おそらく実行可能な解決策ではありません。

@others :考え?

それまでの間、この(それほど美しくはない)回避策を使用できます。

<input type="number" ng-model="search.posts" />
...
<div ng-repeat="user in users | filter:((search.posts===null)?undefined:search)">...</div

デモフィドル

全てのコメント5件

(あなたが言ったように)これは、フィールドが空のときにinput[number]がモデルにnullを割り当てるために発生します。

これが期待どおりに機能することを期待するのは合理的ですが(imo)、どうすればこれに対処できるかわかりません。
nullは検索するのに有効な値である可能性があるため、フィルター側で修正することは望ましくありません(また、未定義として扱うことはできません)。 NgModelControllerそれを修正することも、おそらく実行可能な解決策ではありません。

@others :考え?

それまでの間、この(それほど美しくはない)回避策を使用できます。

<input type="number" ng-model="search.posts" />
...
<div ng-repeat="user in users | filter:((search.posts===null)?undefined:search)">...</div

デモフィドル

パーサーからundefinedを返すと解析エラーが設定されるため、 null返します。 それが最良の設計ではないもう1つの理由。

@Narretzなぜundefined返さないのか尋ねようとしていました:-)

私はこの投稿が少し古いことを知っていますが、私はこの問題を解決する方法を理解するのに本当に苦労したので、私の解決策を共有したいと思います。 入力フィールドにoninputイベントを追加し、javascript関数で、このフィールドの値が空の文字列であるかどうかを確認します。空の文字列の場合は、次のコマンドで入力フィールドの値を削除します。
document.getElementById( 'whatever')。value;を削除します。

HTMLInputElement属性は構成可能であるとは思われません

このページは役に立ちましたか?
0 / 5 - 0 評価