SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();

AngularJSでBootstrapを使う場合、UI Bootstrapを使うと便利だ。もともと、AngularUIと呼ばれていたが、AngularUIが幾つかのサブプロジェクトに別れ、Bootstrap関連はUI Bootstrapとなったようだ。

Bootstrapにはtypeaheadの機能があり、テキストボックスに文字を入力すると、これだろうと候補を上げてくれる、イケてる入力補助だ。今回これを使ってみた。

1. 営業担当の人をテキストボックスへ直接入力した時、typeaheadの機能で候補を選択させる。
2. typeaheadから入力したい候補を選択する。
3. 選択した候補のIDをID欄に表示する。

こんな機能を実現したい。

テキストボックスには

typeahead、変更された事を検知して、営業担当からIDを選択、設定する。

UI Bootstrapでは

typeaheadという属性が定義されているのでこれを使う。

変更された後の処理ではAngularJSのng-change属性を使う。

てっきり上記２点で大丈夫だと思っていたのだが、ハマってしまった。

ng-change属性が邪魔してtypeaheadが動かない。いろいろ調査した結果typeahead-editable=”false”なる属性設定すると動いた。

こんな長い属性設定になってしまった。でもこの設定書いてる順番で動きが変わる。いいのだろうか。