Question

我正在将Ionic移至Ionic 4，并且在Firebase数据库集成方面遇到了麻烦。

问题：每次我尝试将新信息推送到用户uid下的Firebase数据库时，我都会得到

错误错误：具有未指定名称属性的表单控件没有值访问器

我的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>

以下是ts：

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之前完美运行，没有错误）

编辑：我认为这与无法从Radio-Group读取list.color的值有关。我收到了点击错误

错误错误：Reference.push失败：第一个参数包含未定义的属性'WCoOMVhPUZOVPFFhmTpSul2Mtxr1.lists.color'

其中“ WCoOMVh ...”是用户uid和“列表”，我假设是我指向的节点。

离子无线电组错误：没有用于具有未指定名称属性的表单控制的值访问器

0 个答案: