CODEWITHSUNDEEP
angularrxjs
Andar Pratama
Andar Pratama

Reputation: 27

Angular TypeError: Cannot create property on string '' using Rxjs

Iam using Angular 11, use rxjs and i wont filter my course collection to course with category equal "frontend". but i got some error

My Code :

getPosts():Observable<ICourses[]> {
    return this.http.get<ICourses[]>(`${apiURL}course/getall`).pipe(
      map((courses: ICourses[]) => {
          return Object.values(courses).filter(course => {
            course.devCategory = "frontend"
          })
      })
    )
  }

Error :

ERROR TypeError: Cannot create property 'devCategory' on boolean 'true'

Interface ICourses :

interface ICourses {
   _id: string
   title: string,
   image: string,
   instructor: string,
   topic: string,
   level: string,
   price: number,
   hours: number,
   students: number,
   category: string,
   devCategory: string,
   created_at: Date,
   updated_at: Date
   date: string
}

export {ICourses}

If i use this code :

getPosts():Observable<ICourses[]> {
    return this.http.get<ICourses[]>(`${apiURL}course/getall`).pipe(
      map((courses: ICourses[]) => {
          **return courses.filter(course => {
            course.devCategory = "frontend"
          })**
      })
    )
  }

I got this error :

ERROR TypeError: courses.filter is not a function

Upvotes: 0

Views: 1798

Answers (2)

Antoniossss
Antoniossss

Reputation: 32535

This error

ERROR TypeError: Cannot create property 'devCategory' on boolean 'true'

says that this line

course.devCategory = "frontend"

tries to do literally

 true.devCategory="frontend"

which is obviously not what you want to do.

double check what actually is returned in HTTP response as it looks like it is not ICourses[] at all

Upvotes: 3

MrCodingB
MrCodingB

Reputation: 2314

First of all: For filter to work you need to return a boolean value. Also if courses already is an array you won't need Object.values to filter it:

getPosts(): Observable<ICourses[]> {
  return this.http
    .get<ICourses[]>(`${apiURL}course/getall`)
    .pipe(
      map((courses: ICourses[]) => {
        return courses.filter((course) => course.devCategory === "frontend")
      })
    )
}

But you seem to have a problem with your API, because the courses seem to bee boolean values not ICourse objects.

Upvotes: 1

Related Questions