title: Problem with storing data in Firebase (_isScalar: false)
body: <p>I have created a form that stores the course type data in the Firebase. When I try to save a new element it creates this: <a href="https://i.stack.imgur.com/jXO1z.jpg" rel="nofollow noreferrer">https://i.stack.imgur.com/jXO1z.jpg</a>.
  Here's my code in <strong>create-course Component</strong>:</p>
  <pre><code>form: FormGroup = this.fb.group({
      name: [''],
      code: [''],
      ects: [''],
      lekt: ['']
    })
    constructor(private fb: FormBuilder, private dataStorageService : DataStorageService) { }
    ngOnInit(): void {}
    onSaveData(){
      this.dataStorageService.storeCourses();
    }
  </code></pre>
  <p>Here's the code in the <strong>service component</strong> :</p>
  <pre><code>storeCourses(){
          const courses = this.courseService.getCourses();
          this.http.put(
              'https://projekti-ff52b-default-rtdb.firebaseio.com/courses.json',
               courses)
               .subscribe(response =&gt; {
                   console.log(response);});
      }
  </code></pre>
  <pre><code>getCourses() {        
   return of(this.courses);  }  
  </code></pre>
  <p>private courses: Course[] = [];</p>
  <p>And Course [] is an exported interface from course model.ts</p>