угловой 2+ можно отключить асинхронный: ложь - PullRequest
Новая
       25

угловой 2+ можно отключить асинхронный: ложь

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

"async: false" удалено из браузера Chrome.

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

Вы также не можете использовать: 

this.bookOutService.DeletebookOuts().subscribe(()=>{return true;});

как это Observable<boolean> | boolean. 

@HostListener('window:beforeunload')
  canDeactivate(): Observable<boolean> | boolean {

$.ajax({
      type: 'DELETE',
      async: false,
      url: '/api/bookoutAPI/DeleteBookOuts',
    });

    return true;

    //return new Observable<boolean>((observer) => {
    //  debugger;
    //  this.bookOutService.DeletebookOuts().map(() => {
    //    observer.next(true);
    //    observer.complete();
    //  }).take(1);
    //});
  }

1 Ответ

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

Общая проблема в программировании состоит в том, что делать, когда вы ожидаете, что произойдет что-то еще.Это часто случается в javascript, будь то пользовательский ввод или запрос вещей из внешних API.Javascript справляется с этим, имея определенные вещи, которые являются асинхронными.Существует не так много причин, чтобы заставить что-то быть синхронным (другими словами, подождите, пока что-то завершится, прежде чем двигаться дальше).Это особенно верно в отношении javascript, так как если вы заставляете поток ждать завершения xhr, ваш пользовательский интерфейс может заблокироваться и т. Д.

Я бы предположил, что сделать эту функцию асинхронной было бы наилучшей идеей.

Я не уверен насчет API jQuery ajax, но удаления async false может быть достаточно.Также есть некоторые другие проблемы.

Наблюдаемые:

RXJS отличается от «нормального» JavaScript-асинхронного шаблона обратных вызовов или обещаний.С Observables вы определяете набор действий.Затем, когда вы подписываетесь на него, он выполняет эти действия.Это упрощение.Для более подробной информации я бы предложил https://www.learnrxjs.io/concepts/rxjs-primer.html и весь сайт в целом.Я предпочитаю это самим документам.Таким образом, в вашем примере вы только определяете набор вещей, которые должны произойти, вы не подписываетесь на наблюдаемое, поэтому на самом деле ничего не происходит.

HostListener:

HostListener isсинтаксический сахар для target.addEventListener(eventType, callback).В вашем случае цель - window, eventType - beforeunload, а обратный вызов - это то, что вызывает / API / bookoutAPI / DeleteBookOuts в вашем API.То, что ему не нужно, это любое возвращаемое значение.Он также может быть настолько асинхронным, насколько вы хотите.Поскольку HostListeners не заботится о возвращаемом значении, я предлагаю вам удалить его определение машинописного текста (т.е. удалить все между canDeactivate () и {. Если вы предпочитаете всегда указывать возвращаемый тип, вы можете использовать void.

2 возможных решения: 

@HostListener('window:beforeunload')
canDeactivate() {
  $.ajax({
    type: 'DELETE',
    url: '/api/bookoutAPI/DeleteBookOuts',
  });
}

или 

@HostListener('window:beforeunload')
canDeactivate() {
  this.bookOutService.DeletebookOuts().pipe(take(1)).subscribe(
    () => console.log('Success'), //Handle Success
    error => console.log(error) //Handle Error
  );
}

Стоит отметить, что тип возвращаемых данных удален из обоих. В первом асинхронном режиме нет, во втором -a subscribe () (я также использовал более новые конвейерные операторы, а не цепочку методов).

Стоит также отметить, что вам может не понадобиться take (1) в зависимости от реализации DeletebookOuts, япри условии, что он используется, чтобы избежать ручной отписки. Это немного не по теме в этой теме, хотя см. Нужно ли отписываться от наблюдаемых, созданных методами Http? для получения дополнительной информации об этом, или утечки памяти в Google rxjs

...