Не могу использовать любое другое имя переменной, кроме $ event, для получения испущенного числа в Angular - PullRequest
Новая
       18

Не могу использовать любое другое имя переменной, кроме $ event, для получения испущенного числа в Angular

0 голосов
/ 07 апреля 2019

NB.Вопрос не в , как заставить его работать (так как могу, как объяснено внизу).Это скорее о , почему я могу заставить его работать таким образом, а не каким-либо другим.

Я разработал такой компонент.Это строка данных, которая может хранить кучу или несколько строк данных.Следовательно, в каждом таком случае у нас есть как onRemoval (вызывается, когда пользователь нажимает на значок удаления), так и onRemove (вызывается, когда слышится излученный чет). 

@Output() remove: EventEmitter<number> = new EventEmitter<number>();
...
onRemoval() {
  console.log("being removed: " + this.id);
  this.remove.emit(this.id);
}
onRemove(id: number) {
  console.log("removing: " + id);
  if (!id)
    return;

  this.subRows.splice(id, 1);
}

Я уверен, что упускаю что-то глупое, но что удивляет меня, когда я пытаюсь отладить, так это то, что переданное значение является правильным индексом, а полученное значение - нет.Это не определено .

Соответствующая часть разметки, которую я пробовал, выглядит следующим образом.Я также пробовал с пустыми парантезами, а также без парантезов. 

<div *ngIf="unfolded">
  <app-data-row *ngFor="let subRow of subRows"
                (remove)="onRemove(id)"
                [config]="subRow"></app-data-row>
</div>

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

Единственный способ заставить его работать, это вызвать переменную точно $ event и больше ничего.Это я делаю что-то глупое или это требуемый синтаксис ?!Я имею в виду, даже * $ id $ не помог ...

Ответы [ 2 ]

1 голос
/ 07 апреля 2019

$event - это само событие при использовании @Output генератора событий компонента / директивы, который испускает значение, и оно захватывается функцией обратного вызова с переменной $event.

Когда вы определяете прослушиватель событияс круглыми скобками, такими как

(remove)="onRemove($event)"

, вы фактически передаете ссылку на метод.Вам не нужна локальная переменная, определенная ранее.И сам Angular заменяет значение $event на испущенное.Но если вы сделаете это, как

(remove)="onRemove(id)"

, он будет считать id локальной переменной, такой как вы определили в *ngFor="let id of idList"

Короче говоря, этоединственный способ захватить испущенное значение при использовании генератора событий вывода компонента / директивы.

Вы можете взглянуть на эти официальные документы: https://angular.io/guide/user-input

А также этоSO thread: Что именно объект $ event делает в Angular 2?

1 голос
/ 07 апреля 2019

В шаблоне, при подключении дочернего вывода к обратному вызову компонента: $event - это имя испускаемого значения, и нет никакого способа обойти это.В конце концов: для вызова обработчика не требуется , чтобы вывод был единственным аргументом.Вы можете сделать, не знаю, 

<app-data-row *ngFor="let subRow of subRows" (remove)="onRemove(subRow.id)">

или 

<app-data-row *ngFor="let subRow of subRows" (remove)="onRemove(subRow.id, $event)">

или 

<app-data-row *ngFor="let subRow of subRows" (remove)="onRemove($event, subRow.id)">

и так далее, и так далее.Итак, здесь, в шаблоне, $event необходим в качестве идентификатора фактического выходного значения.

...