iXdi - Σύγχρονος προγραμματισμός

Ο τύπος 'Observable‹HttpEvent‹›› δεν μπορεί να εκχωρηθεί στον τύπο 'Observable‹›

Έχω αυτό το απόσπασμα κώδικα:

SubmitTransaction(transNumber: string, transactionRequest: ITransactionRequestObj): Observable<TransactionResponse> {
    this.body =  JSON.stringify(transactionRequest);
    this.headers = new HttpHeaders().set('Content-Type', 'application/json');
    this.headers.append('Accept', 'application/json');
    this.options = new RequestOptions({headers: this.headers});
    return this.http.post<TransactionResponse>(this.baseUrl + '/transactions/' + transNumber + '/new',  this.body, this.options)
   .pipe(catchError((e) => this.errorHandler(e)));
  }

όπου το μόνο που έκανα ήταν να αναβαθμίσω το έργο μου από Angular 5 σε Angular 6 και να αλλάξω το .catch((e) => this.errorHandler(e)); σε .pipe(catchError((e) => this.errorHandler(e))); . Ωστόσο, λαμβάνω το ακόλουθο σφάλμα TypeScript για τη συγκεκριμένη μέθοδο.

Λάθος:

[ts]
Type 'Observable<HttpEvent<TransactionResponse>>' is not assignable to type 'Observable<TransactionResponse>'.
  Type 'HttpEvent<TransactionResponse>' is not assignable to type 'TransactionResponse'.
    Type 'HttpSentEvent' is not assignable to type 'TransactionResponse'.
      Property '_transactionNumber' is missing in type 'HttpSentEvent'.

Δεν είμαι σίγουρος τι πρέπει να κάνω σε αυτό το σενάριο. Το παραπάνω απόσπασμα κώδικα λειτουργούσε στο Angular 5. Τι πρέπει να κάνω για να το διορθώσω για το Angular 6;

ΕΠΕΞΕΡΓΑΣΙΑ:

errorHandler(error: HttpErrorResponse) {
      return throwError(error.message || 'Server Error');
  }

Έχω παρατηρήσει ότι αν δεν χρησιμοποιώ το HttpHeaders, λειτουργεί:

SubmitTransaction(transNumber: string, transactionRequest: ITransactionRequestObj): Observable<TransactionResponse> {
    this.body =  JSON.stringify(transactionRequest);
    this.headers = new HttpHeaders().set('Content-Type', 'application/json');
    this.headers.append('Accept', 'application/json');
    this.options = new RequestOptions({headers: this.headers});
    return this.http.post<TransactionResponse>(this.baseUrl + '/transactions/' + transNumber + '/new',  transactionRequest)
    .pipe(catchError((e) => this.errorHandler(e)));
  }

Ωστόσο, ίσως χρειαστεί να χρησιμοποιήσω τα HttpHeaders... ποια είναι η λύση σε αυτό το σενάριο;


  • δημοσιεύστε τον κωδικό χειριστή σφαλμάτων σας παρακαλώ 04.08.2018
  • @firegloves επεξεργάστηκε ανάρτηση. 04.08.2018
  • Νομίζω ότι το HttpHeaders είναι αμετάβλητο, θα πρέπει να συνδέσετε μια σειρά μεθόδων μαζί αντί να προσαρτήσετε 04.08.2018
  • Χρησιμοποιώντας το Angular 6 / RxJs 6, δεν είναι απαραίτητο να χρησιμοποιήσετε το JSON.stringify() στο σώμα του αιτήματος. Προσθέτοντας στην παραπάνω απόκριση, οι κεφαλίδες είναι αμετάβλητες, επομένως κάθε κλήση για προσθήκη επιστρέφει μια νέα παρουσία του αντικειμένου κεφαλίδων. Οι περισσότερες περιπτώσεις που δημιουργείτε στην κλήση συνάρτησης δεν είναι πραγματικά απαραίτητες. Υπάρχει κάποιος συγκεκριμένος λόγος για τον οποίο το κάνετε αυτό; Προσπαθείτε να αποθηκεύσετε αυτές τις μεταβλητές για μελλοντική χρήση; 08.08.2018

Απαντήσεις:


1

Το HttpHeaders είναι μια αμετάβλητη δομή δεδομένων.

Η μέθοδος append επιστρέφει μια νέα παρουσία του HttpHeaders αντί να μεταλλάξει την υπάρχουσα, που σημαίνει ότι θα χρειαστεί να κάνετε μια μικρή αλλαγή στον κώδικά σας.

// old
this.headers.append('Accept', 'application/json')

// new
this.headers = this.headers.append('Accept', 'application/json')

Ακόμα καλύτερα, απλά κάντε τα όλα ταυτόχρονα:

this.headers = new HttpHeaders()
  .set('Content-Type', 'application/json')
  .set('Accept', 'application/json')
04.08.2018
  • Ευχαριστώ. Ωστόσο, εξακολουθώ να λαμβάνω το ίδιο σφάλμα. Τι γίνεται με αυτό: this.options = new RequestOptions({headers: this.headers}); ? Είναι αυτό σωστό? Διαμαρτύρεται για την προσθήκη του this.options στην ανάρτηση 04.08.2018

  • 2

    Εκτελώντας αυτό το απόσπασμα κώδικα στο Angular 6, το RxJS 6 ενεργοποιεί το αίτημα χωρίς το παραπάνω σφάλμα. Θα πρέπει να σας παρέχει το ίδιο ακριβώς αποτέλεσμα με τον παραπάνω κώδικά σας:

    SubmitTransaction(transNumber: string, transactionRequest: TransactionRequest): Observable<TransactionResponse> {
        return this.http
          .post<TransactionResponse>(`/myurl/transactions/${transNumber}/new`, transactionRequest, { headers: new HttpHeaders()
              .set('Accept', 'application/json') })
          .pipe(
            catchError(error => throwError(error.message || 'Server Error'))
          );
      }

    Έχω απλοποιήσει τον κώδικα για να μην δημιουργηθεί μια παρουσία RequestOptions, αφήνοντας αυτή τη διαδικασία στη ροή προεπεξεργασίας μετά την επεξεργασία του HttpClient, η οποία δημιουργεί την παρουσία για εσάς με βάση τον παρεχόμενο κατακερματισμό.

    Έχω επίσης αφαιρέσει την προσωρινή αποθήκευση για το σώμα, τις κεφαλίδες και τις επιλογές από την κλήση μεθόδου σας. Μη διστάσετε να τις προσθέσετε ξανά με τις εξαγόμενες μεταβλητές από τον κατακερματισμό επιλογών που δηλώθηκε στην ανάρτηση κλήσης, ωστόσο, εκτός και αν σκοπεύετε να αποθηκεύσετε αυτές τις μεταβλητές στην προσωρινή μνήμη, δεν χρειάζεται πραγματικά να το κάνετε αυτό.

    08.08.2018
    Νέα υλικά

    Το όνομά μου είναι Abdul Qudus.abd
    Το όνομά μου είναι Abdul Qudus.abd Είμαι διαδικτυακός συγγραφέας και γράφω άρθρα. Έχω 3ετή εμπειρία στη διαδικτυακή συγγραφή. οπότε θα είμαι ο καλύτερος συγγραφέας στην πλατφόρμα σας. είμαι ο..

    Το Python Selenium Web Scraping σας κατέβασε το 2023; Εκκαθαρίστε την προσωρινή μνήμη και ενισχύστε τα αποτελέσματά σας!
    Η απόξεση ιστού με το Python Selenium είναι ένα εξαιρετικό εργαλείο για την εξαγωγή δεδομένων από ιστοσελίδες. Ωστόσο, περιστασιακά, οι ιστοσελίδες ενδέχεται να αποτύχουν να φορτώσουν ή να..

    Έννοιες JavaScript που πρέπει να γνωρίζετε για να ξεκινήσετε με το React
    Αφού είδα αυτή την ερώτηση να τίθεται αμέτρητες φορές, πιστεύω ότι μπορεί να είναι χρήσιμο σε πολλούς ανθρώπους εκεί έξω να έχουν μια σαφή κατανόηση του τι χρειάζεται να είναι γνωστό στο..

    Χρήση της C++ ως γλώσσας δέσμης ενεργειών, μέρος 8
    Βελτίωση κλήσεων λειτουργιών API με χρήση ενσωματωμένης συναρμολόγησης Έχω πειραματιστεί με την ενσωματωμένη συναρμολόγηση στο παρελθόν με κάποια επιτυχία. Είναι περίπλοκο και εύκολο να κάνεις..

    5 αμυχές που πρέπει να γνωρίζετε για να γίνετε σπουδαίος προγραμματιστής.
    5 αμυχές που πρέπει να γνωρίζετε για να γίνετε σπουδαίος προγραμματιστής. Αυτές τις μέρες, πολλοί φιλοδοξούν να εργαστούν ως προγραμματιστές. Αλλά το να γίνεις σπουδαίος προγραμματιστής δεν..

    Πώς να εφαρμόσετε το Deep Learning σε δομημένα δεδομένα
    Η βαθιά μάθηση είναι ένα καυτό και περιζήτητο θέμα τώρα ως μέρες. Η επιτυχία του προέρχεται από το γεγονός ότι είναι εξαιρετικά αποτελεσματικό στην επίλυση σύνθετων προβλημάτων και στην επίτευξη..

    Είναι το AI καλύτερο από τα ζώα στο να βλέπουν στο σκοτάδι;
    Τέχνη Μηχανικής Εκμάθησης Είναι η τεχνητή νοημοσύνη καλύτερη από τα ζώα στο να βλέπουν στο σκοτάδι; Τα όρια της όρασης ρομπότ στο ακραίο σκοτάδι Μελέτη της συμπεριφοράς των ζώων τη..