web-dev-qa-db-ja.com

複数の式でng-clickを使用する方法は?

Ng-clickを使用して複数の式を実行したい。次のように、モデルに値を設定し、$scopeからメソッドを呼び出します。

<a ng-click="navigation.book = book && bookSvc.showBook(book)" href="#{{book.id}}">{{book.title}}</a>

実行したい2つの異なる式を分離する&&があります。コントローラーで両方のことを行うメソッドを追加できることはわかっています。私はそれをやるべきですか、それともng-clickの中から直接2つの式を実行する方法がありますか?

58
CorayThan

単に「;」を使用する式を区切る '&&'の代わりに動作するはずです:

<a ng-click="navigation.book = book; bookSvc.showBook(book)" href="#{{book.id}}">{{book.title}}</a>
130
urish

ng-clickには式のみを書き込むことができます。

NgClickディレクティブを使用すると、要素がクリックされたときのカスタム動作を指定できます。

しかし、あなたは書くことができます:

<a ng-click="( (navigation.book = book) && bookSvc.showBook(book))" href="#{{book.id}}">{{book.title}}</a>

この場合、navigation.bookbookコンテンツを取得します。

デモ Fiddle

参照

navigation.book = bookを呼び出すためのいくつかのオプションがあります

次のように書くとどうなりますか:

ng-click="( bookSvc.showBook(book) && (navigation.book = book))"

この場合(bookSvcはサービスのように見えます)bookSvc.showBook(book)は何も返さないか、falseを返しますが、navigation.book = bookは実行されません。

デモ2 Fiddle

ただし、bookSvc.showBook(book)trueを返す場合、navigation.book = bookが呼び出されます。

デモ3 Fiddle

11
Maxim Shoustin

コードをよりシンプルでエレガントにするために、すべてのロジックを関数に入れて、ng-clickを割り当てることをお勧めします。

4
Sergei Basharov