angular - Angular: nested div clicked

Question

I have a nested div. Both has a (click) event.

<div id="outer" (click)="foo (1)">
  <div id="inner" (click)="foo (2)">
  </div>
</div>

If I click outer then I get foo(1). If I click inner I get foo(2) and then foo(1).

1. How can I make it the angular way to only get foo(2) if I click inner?

2. How can I make inner to ignore any click in inner?

   click="" or click="false" does not work.

Answer 1

像这样

<div id="outer" (click)="foo (1)">
  <div id="inner" (click)="(e) => {foo (2); e.stopPropagation()}">
  </div>
</div>