Ошибка ионной радиогруппы: отсутствует средство доступа к значению для элемента управления формы с неопределенным атрибутом имени

Question

Я перевожу свой Ionic на Ionic 4 и у меня проблемы с интеграцией базы данных Firebase.

Проблема: Каждый раз, когда я пытаюсь отправить новую информацию в базу данных Firebase под uid пользователя, я получаю

Ошибка: Ошибка доступа к элементу управления формой с неопределенным атрибутом имени

Мой код для HTML:

<ion-content no-bounce padding id="master">
    <div class="list">
      <ion-item>
        <ion-input class="title" type="text" placeholder="Add your title here" [(ngModel)]="list.name"></ion-input>
      </ion-item>
      
        <ion-list no-lines [(ngModel)]="list.color">
          <ion-radio-group>
          <p class="radio-label">Pick your list colour</p>
            <ion-item>
              <ion-label class="labelC">Light Coral</ion-label>
              <ion-radio class="radioC" slot="start" value="#f55f7c"></ion-radio>
            </ion-item>
            <ion-item>
              <ion-label class="labelY">Sandy Brown</ion-label>
              <ion-radio class="radioY" slot="start" value="#ffcb53"></ion-radio>
            </ion-item>
            <ion-item>
              <ion-label class="labelB">Aquamarine</ion-label>
              <ion-radio class="radioB" slot="start" value="#85dec8">Aquamarine</ion-radio>
            </ion-item>
          </ion-radio-group>
          </ion-list>
    </div>
    
    <div class="button"><ion-button (click)="createNewList1(list)">ADD LIST</ion-button></div>
</ion-content>

Вот тс:

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

// Firebase imports
import { AngularFireAuth } from '@angular/fire/auth';
import { AngularFireDatabase, AngularFireList } from '@angular/fire/database';
import * as firebase from 'firebase';

// Model import
import { List } from '../models/list.interface';

@Component({
  selector: 'app-add-list',
  templateUrl: './add-list.page.html',
  styleUrls: ['./add-list.page.scss'],
})
export class AddListPage implements OnInit {

  list = {} as List;
  newListRef$: AngularFireList<List>;
  listId: any;
  userId: any;

  constructor(
    public router: Router,
    private db: AngularFireDatabase,
    private afAuth: AngularFireAuth) {
  }

  ngOnInit() {
    this.userId = firebase.auth().currentUser.uid;
    this.newListRef$ = this.db.list(this.userId + '/lists');
  }

  createNewList1(list: List) {
    this.newListRef$.push({
      name: this.list.name,
      color: this.list.color
    });
    this.router.navigateByUrl('main/' + this.userId);
  }
}

Я также сослался на новые правила ионных кнопок, которые установил Ionic.

Но я продолжаю получать ошибки ...

(Этот код работал без ошибок до того, как я начал перемещать его в Ionic 4)

Редактировать: Я думаю, что это связано с невозможностью прочитать значение list.color от Radio-Group.Я получаю сообщение об ошибке

Ошибка: Ошибка Reference.push: первый аргумент содержит неопределенное значение в свойстве 'WCoOMVhPUZOVPFFhmTpSul2Mtxr1.lists.color'

где 'WCoOMVh... 'это пользовательский uid и' lists ', я предполагаю, что это узел, на который я указываю.