2016-10-31 11 views
0

私は、国のドロップダウンを持っています。私の奇妙な唯一の要件は、コントローラからOnChange関数を渡してDirectiveで実行できるようにすることです。 PlunkerでHere is a PlunkerディレクティブngChangeは、コンボボックスオプションと同じ回数だけ起動します。

、私はこの基本的なテンプレートがあります。

<div> 
    <label for="countryDirective">Country</label> 
    <select id="countryDirective" ng-model="country" ng-Change="countryChanged()" ng-options="obj.value as obj.name for obj in countries"> 
     <option value="">Choose Your Country</option> 
    </select> 
    <span>{{country}}</span> 
</div> 

を、ページ上のHTMLとディレクティブのテンプレートとの唯一の違いは、私は、ページ上のHTMLにNG-の変更を追加したことです。

私の指示には注記の1つがあり、require: '^ngChange'を使用しています。

それは非常によく文書化されていない理由を私は知らないが、それは驚異を働かせると範囲が更新される前に発射イベントを変更することに関する他の質問やその他の変動問題によって生じる問題の周りのすべてを取得します。

しかし、このエレガンスの価格は、countryChanged()関数がx回発生していることです。ここで、xはドロップダウン内の項目の数です。私はアイテムが一度に1つずつ観察されているので、変化が起こっていると仮定します。

私の主な質問は:どのようにこの優雅さを保つのですか?しかし、変更ごとに1回だけ火災を変更しますか?

編集:は彼らが私のngChangeが指令にx回を発射されている理由の主な問題をsync'ing、なくはないと私の問題を修正ngRepeat ngOptionsの代わりに、オプションを選択するように切り替えが判明。

+0

あなた 'SELECT'タグ内に' NG-options'のためにあなたのオプションタグの内側にあなたの 'NG-repeat'を交換するようにしてくださいを更新しました。あなたのnの問題を解決するかどうかは分かりませんが、それは可能性があります。そして、あなたが望むことをするのはお勧めの方法です。 – lucasnadalutti

+0

これで問題は解決しませんが、より洗練されています。私が '' ngRepeat'にもっと慣れているので、selectを終了する前に 'ngOptions'にジャンプしないこともあります。しかし、私は先に進み、そのステップを踏んでPlunkrを更新しました。それでも、onChangeメソッドが何回も実行されるのを止めませんでした。しかし、それは私の2番目の質問を修正し、何らかの理由でそれらを同期させています。 – Suamere

答えて

1

私は問題がsetValueのだったと思います: '= ngChange'

私はsetValueのにそれを変更:今、そのだけトリガー '& ngChange' と<select/>

にNG-変更は= "のsetValue()" を追加(コンソールログを確認してください)。

私はplunker https://plnkr.co/edit/xYi4uoNLeJVvKAoZhjbH?p=preview

+0

良いキャッチ。私は最後の1時間でこの答えを見たことがなく、結論に達しましたが、あなたが最初に投稿して以来、私は確かにあなたにポイントを与えます。回答ありがとうございます! – Suamere

関連する問題