2013年11月1日金曜日

angular-jsのng-optionsで謎の空白でvalue="?"なoptionが発生する

しばらくハマったのでメモ

ng-optionsでoptionを設定するselectに外から持ってきたデータをあとで追加するときに、何故か空白の要素が追加されてしまって困っていました。結局ng-modelとng-optionsを両方使うときに、ng-modelで指定されているオブジェクトが追加された要素にない場合に発生することがわかりました。なので元のデータを入れてやるか、データが追加された後にもう一度ng-modelで指定しているオブジェクトを設定して直してやる必要があります。まあ考えれば単純な話なのですが気づくまでに時間がかかってしまいました。


再現HTML
初期時様態のselect
ng-repeatで使うarrayにng-modelで指定されているデータがある場合(load1)
ng-repeatで使うarrayにng-modelで指定されているデータがない場合(load2)