Почему Subscribe работает без Observable в Angular

Я хотел понять некоторые основы Angular и HttpClient. Мой код работает, но я не понимаю, как. Я проверил эти две ссылки:

  1. Как правильно подписаться на Angular HttpClient Observable?
  2. Как объявить возвращаемые типы для функций в TypeScript

Я смотрел это видео на YouTube:

  1. можно наблюдать и подписываться в Angular 8 | Учебник по Angular 8 на хинди

Я узнал, что синтаксис метода GET HttpClient: get(url: string, options: {...}): Observable<any>

Так что я сделал, как мне сказали сделать в видео. Вот мой случай 1:

Пользовательская служба

...
export class UserService {
  constructor(private _http: HttpClient) { }
  getAllUsers() {
    return this._http.get("https://jsonplaceholder.typicode.com/users"):Observable<any>;
  }
}

Почему VSCode жалуется:

Значение типа 'typeof Observable' не может быть вызвано. Вы хотели добавить "новый"?

На самом деле мой код работает отлично, если я вообще не указываю Observable. Вот случай 2:

...
export class UserService {
  constructor(private _http: HttpClient) { }
  getAllUsers() {
    return this._http.get("https://jsonplaceholder.typicode.com/users");
  }
}

И вот мой компонент (для обоих случаев):

Список пользователей

  users=[];

  constructor(private userService: UserService) { }

  ngOnInit() {  
    this.fetchAllUsers();  
  }

  fetchAllUsers() {
    this.userService.getAllEUsers().subscribe(
      res => {
        this.users.push(res)
      }
    );    
  }

Укажите на мои ошибки в обоих случаях. Я думаю, что где-то нарушаю правила Angular.

PS: Скриншот урока YouTube:

return this._http.get("..."):Observable<any>; -- это недопустимый синтаксис. Можете ли вы проверить еще раз, что такое фактический код?
31piy 24.12.2020 08:27

@ 31piy, это руководство не содержит кода. Но я добавил скриншот.

Tanzeel 24.12.2020 08:40
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
2
154
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Следующая строка является недопустимым оператором в вашем коде:

return this._http.get("https://jsonplaceholder.typicode.com/users"):Observable<any>;

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

getAllUsers(): Observable<any> {
  return this._http.get("https://jsonplaceholder.typicode.com/users");
}

Возможно, вы захотите пройти курс повышения квалификации по TypeScript здесь.

Я также добавил скриншот в вопрос. Только сейчас добавил. Мне сказали следовать тому же.

Tanzeel 24.12.2020 08:38

И как это работает, когда я вообще нигде не указываю Observable?

Tanzeel 24.12.2020 08:41

Вам нужно будет понять разницу между объявлением и реализацией. Скриншот описывает объявление метода. Кроме того, тип возврата http.get по умолчанию — Observable<any>, поэтому нет никакой разницы, если вы не добавите тип возврата в свой метод.

31piy 24.12.2020 08:45

@Tanzeel - я добавил ссылку на документ TS в свой ответ. Возможно, вы захотите узнать больше о TS, прежде чем переходить к Angular.

31piy 24.12.2020 08:47

Это действительно было очень полезно.

Tanzeel 24.12.2020 08:58

Другие вопросы по теме

Как в функциональных компонентах переформатировать несколько обработчиков изменений в одной функции?
Создайте типизированный словарь с циклом for, используя перечисление в качестве типа ключа, но без использования `?` для пометки undefined в TypeScript
Тип возвращаемого значения Typescript в зависимости от параметра объекта
Как я могу написать функцию выбора, которая выбирает только свойства (без повторения типов в ограничениях общего типа) в машинописном тексте
Как установить состояние в TypeScript без получения ошибки присваивания?
Мое входное значение не меняется, когда я удаляю некоторый контент и меняю состояние
Как проверить щелчок по раскрывающемуся меню выбора?
Как получить обновленный счет при выборе фильтра?
Как выполнить 2 функции друг за другом в Typescript?
Безопасность типов машинописного текста для общего класса графоподобной структуры данных