web-dev-qa-db-ja.com

Angular UIブートストラップ：先に入力して複数を選択

私はangular UI bootstrapフォームの先行入力に先行入力ディレクティブを使用しています

http://angular-ui.github.io/bootstrap/

$httpサービスを介してリモートサーバーからレコードをフェッチしています。正常に動作しています。ただし、リストから一度に選択できる要素は1つだけです。

リストから複数の値を選択し、SOのタグと同じように、現在選択されているすべての要素を削除ボタンで入力フィールドに表示したいと思います。選択したタグはangular配列モデルに保存されます。

これを達成する方法は？

Angular UI bootstrapのドキュメントを読みましたが、何も見つかりません。

angularjstwitter-bootstrapangular-ui-bootstrap
10
Syed

この男はこれについて指示を出しました。あなたが望むことを正確に行う必要があり、それはui-bootstrapsタイプアヘッドを使用しています。

https://github.com/mbenford/ngTagsInput

13
m.brand

私がこれまでに見つけた最善の解決策は io.select 必要なことを正確に実行し、事前に複数選択します。マークアップもきちんとしていてきれいです。例：

<oi-select
  oi-options="list.id as list.description for list in lists"
  ng-model="tags"
  multiple
  placeholder="Select">
</oi-select>

このコンポーネントは、bootstrapおよび新しいbootstrap 4とも互換性があります。

2
Kevin Burton

Jsファイル：

選択したすべてのアイテムを一覧表示するには、typeahead-on-selectで$ itemを使用し、ex.evtMemの配列にプッシュします。選択したアイテムを削除するには、fnを削除します。

HTML：テーブルを使用して、ng-repeatを使用してすべての配列値を一覧表示します。その追加に加えて、グリフィコン画像を削除し、対応するアイテムを削除する機能を追加します。

0
Raviraj