바인딩 Aurelia 이벤트 처리기가 기본 동작을 방지합니다.

Question

내 페이지의 링크가 내 페이지의 앵커로 이동합니다. 링크 중 하나를 클릭했을 때 메뉴가 축소되어 기본 동작이 계속 발생하도록하고 싶습니다. aurelia 이벤트 처리기를 바인딩 할 때 기본 동작이 전혀 발생하지 않는 것 같습니다 (링크가 탐색하지 않습니다). aurelia 이벤트 핸들러를 바인드 할 수있을뿐만 아니라 앵커 태그에 대한 기본 조치가 있습니까?

예 :

HTML

<ul class="${navClass}"> 
    <li><a href="#about" click.trigger="_toggleMenu()"><i class="fa fa-pencil" style="color: #FFFF00;"></i><span>About</span></a></li>   
</ul> 

JS

_toggleMenu() { 
    if(this.navClass == 'nav') { 
     this.navClass += ' expand'; 
    } else { 
     this.navClass = 'nav'; 
    } 
} 

Answer 1

사용 click.delegate="_toggleMenu()" (또한 트리거로 작동하지만, 대리자, https://github.com/aurelia/binding/blob/master/doc/article/en-US/binding-delegate-vs-trigger.md를 참조 선호)

그런 다음에 true를 반환 액션 버블 :

_toggleMenu() { 
    if(this.navClass == 'nav') { 
     this.navClass += ' expand'; 
    } else { 
     this.navClass = 'nav'; 
    } 

    return true; 
}