問題タブ [angular-bootstrap]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
824 参照

angularjs - ui.bootstrap ぼかし付きタイプアヘッド

私はAngular Bootstrap typeahedを使用しています。

https://twitter.github.io/typeahead.js/examples/のように、入力に完全でない単語をぼかしで表示する可能性があります。

ui.bootstrap-typeahed でこれを実行しようとしましたが、文字しか入力していません。$http リクエストを使用して、データの要素を取得します。

アイデアをありがとう。

0 投票する
4 に答える
12107 参照

css - mouseenter の angular-bootstrap ドロップダウンと、クリックされる前にドロップダウン メニューが非表示にならないようにします。

まず、私はこの投稿を認識しています: Activating
bootstrap dropdown menu on hover
Bootstrap Dropdown with Hover
How to make twitter bootstrap menu dropdown on hover rather than click
.
最初に、angular-bootstrap ドロップダウン ディレクティブの is-open 属性を次のように使用しました。

それはうまくいくように見えましたが、2つのバグが現れました:

  • 1 つ目は、dropdown-toggle 要素がクリックされたとき、ドロップダウン メニューが表示されなくなり、もう一度クリックしても元に戻りません。ドロップダウン メニューを元に戻すには、マウスを離してからドロップダウン トグルにマウスを入力する必要があります。
  • 2 つ目は css/html の問題です。

通常、ドロップダウンの通常の css ソリューションは次のようになります。

ドロップダウン メニューがドロップダウン トグル要素内にあることに注意してください。これは、ドロップダウン トグルからドロップダウン メニューにマウスで移動すると、親から子に移動することを意味します。その子では、ドロップダウンメニューは引き続き表示されます。一方、ブートストラップドロップダウンはクリックイベントで機能するため、ドロップダウンメニューをドロップダウントグルの子として持つ必要はありませんが、誰かが望むときにマウスがドロップダウンから離れたら、動作を mouseenter/hover に変更します-トグル ドロップダウン メニューが消えるため、ドロップダウン メニュー要素にアクセスできなくなります。これは、このプランカーに表示されます

最初のバグを修正するために、ドロップダウン ディレクティブを削除してから、 is-open を次のように ng-class ディレクティブに置き換えました。
これを変える:

これに:

残りは、最初のバグを修正したプランカーのままです。
2 番目のバグはトリッキーです。ドロップダウン メニューがドロップダウン トグルの子ではなくなったため、トグルからメニューに移動している間はホバー効果が持続しないため、これを行いました。これを変更しました:

これに:

それはできましたが、開いたままのドロップダウンメニュー項目をクリックすると別のバグが発生したため、これを実行してハッキングを続けました。これを変更しました:

これに:

それは私に必要な動作plunkerを与えます。
とはいえ、単純な視覚効果のために多くのディレクティブがここに含まれているため、これは良い解決策ではありません。私が提供した最後のプランカーには、Bootstrap や AngularJS が含まれていない CSS ソリューションが含まれていますが、これは必須の動作ですが、必須ではありません。 html構造または視覚的な結果、必要なのは、トグル要素のパディングではなく、ドロップダウントグルとドロップダウンメニューの間にスペースを空けることです。これにより、この状況ではcssソリューションが無効になります。
それで、私の質問は、新しいプラグイン/ライブラリを追加せずに、ホバードロップダウンメニュー用のよりクリーンで簡単に再利用可能なソリューションを追加するより良い方法はありますか?

0 投票する
2 に答える
6895 参照

javascript - Angular Bootstrap ドロップダウン トグルが機能しない

ドロップダウンを切り替えていないように見える Angular Bootstrap ドロップダウン メニューがあります。クリックしても何も表示されませんが、検査要素のリスト項目は表示されます。

HTML:

ドロップダウン コントロール:

});

0 投票する
1 に答える
685 参照

javascript - ディレクティブ テンプレートがモーダル入力でレンダリングされない

入力フィールドが開いたときにオートフォーカスするように、カスタム ディレクティブを作成した angular-bootstrap モーダルがあります。ディレクティブ テンプレートを入力タグに追加しましたが、検査要素ではどこにも表示されません。コード:

ディレクティブ (からコピー: How to set focus on input field? )

HTML:

モーダルコントロール:

0 投票する
1 に答える
9853 参照

javascript - angular ブートストラップ ドロップダウン メニューが閉じられたことを認識する

angular-bootstrapドロップダウンメニューが閉じていることを認識する方法はありますか? このイベントを認識して特定の機能を実行したい。

0 投票する
1 に答える
5772 参照

angularjs - Angular Timepicker の最小時間と最大時間を設定するには?

Angular のブートストラップ タイム ピッカーの最小時間と最大時間を設定する方法はありますか? Angular の Datepicker 設定では、最小日付と最大日付がサポートされています。Timepicker に同様の機能が許可されているかどうか疑問に思っています。

Timepickerの Angular ドキュメントの設定を見ると、これを行う方法がないように見えます...しかし、誰かがこの動作を達成する方法に精通しているかどうか疑問に思っています。事前に洞察/アドバイスをありがとう!


編集:

私がやろうとしていることの背景をもう少し説明するには:

2 つのタイムピッカーが並んでいます。左側のピッカーでは開始時刻を選択でき、右側のピッカーでは終了時刻を選択できます。どちらの開始時刻を選択しても、終了時刻のタイムピッカーの下限を設定し、どちらの終了時刻を選択しても、開始時刻のタイムピッカーの上限を設定する必要があります。

0 投票する
1 に答える
21457 参照

angularjs - Angularjs アコーディオン アクセス isOpen 状態

アコーディオングループが開いているかどうかにアクセスする方法はありますか? isOpen ディレクティブがあることは知っていますが、純粋に html でその状態にアクセスする方法があるかどうかはわかりません。双方向バインディングを使用 (および悪用) すると、その状態を保持する変数を設定できますが、isOpen0、isOpen1、isOpen2 などを実行しないと、ネストされたアコーディオンでは機能しません。ng-init を使用して「宣言」することもできます。ネストされたアコーディオンのスコープに新しい isOpen がありますが、それは良い考えのようには思えません。

http://plnkr.co/edit/l5y4raei99pedNWcE225