EventEmitter не работает в Angular5, как я могу заставить его работать?

Question

Я приложил 4 часа усилий, чтобы решить эту проблему, я изучил много кодов, хотя я и кодировал таким же образом, у меня ничего не получалось.

У меня есть parent и child, и я хочу, чтобы дочерний компонент вызывал один из методов в parent. Позвольте мне показать мои коды, что не так с моим кодом?

child.ts

@Component({
  selector: 'app-card',
  templateUrl: './card.component.html',
  styleUrls: ['./card.component.css']
})
export class ChildComponent implements OnInit {
  @Input() cardMode: CardMode;
  @Input() cardItem: CardModel;

  @Output()
  cardSelected: EventEmitter<string> = new EventEmitter<string>();

.......
 cardClick(): void {
    this.cardSelected.emit("aaaa");
  }
.......
}

child.html

<a (click) ="cardClick()"> 
     .....
</a>

parent.ts

export class ParentComponent implements OnInit {
.......
 onCardSelected(event) {
    console.log(event);
  }

}

parent.html

<app-card [cardItem]="activeCard" [cardMode]="CardMode.Detail"
              (cardSelected) = "onCardSelected($event)" >
 </app-card>

Когда ребенок работает по клику, после emit ("aaaa"); метод родителя не срабатывает. Какую проблему я пропускаю?