ngControl 的未指定名称属性的表单控件没有值访问器答案

【问题标题】：No value accessor for form control with unspecified name attribute for ngControlngControl 的未指定名称属性的表单控件没有值访问器
【发布时间】：2019-08-17 12:50:11
【问题描述】：

我正在创建一个 Ionic 社交应用。您将图片上传到 Firebase 后端。转到个人资料页面时，我收到以下错误消息：具有未指定名称属性的表单控件没有值访问器。

因此，当页面加载时，如果没有来自 firebase 的下载 url，它应该返回图像位置以使用默认按钮图像。如果 firebase 中有 photo0 的图像，那么它应该使用该 url。每当用户上传或删除图片时，NGModel 都应该动态变化。但是当我加载该页面时，我得到了无值访问器错误。不知道我在这里做错了什么。

import { Component, OnInit } from '@angular/core';
import { AuthService } from '../../services/user/auth.service';
import { ImageService } from '../../services/image.service';
import { Router } from '@angular/router';
import * as firebase from 'firebase/app';
import { AngularFireAuth } from 'angularfire2/auth';

    public photo0: string;

  
    constructor(private router: Router,
              private authService: AuthService,
              private imageService: ImageService,
              private afAuth: AngularFireAuth) {

      this.afAuth.authState.subscribe(user => {
      this.userId = user.uid
      console.log('constructoruser', this.userId);
      });
              }
  
  ngOnInit() {
          this.firestore.ref(`/Photos/${ this.userId }/`).child('photo0').getDownloadURL().then((url) => {
          this.photo0 = url;
        }).catch((error) => {
          console.log(error.message);
          this.photo0 = 'assets/img/add-an-image.png';
          console.log(this.photo0);
        });
  }

            <div>
                <div [(ngModel)]="photo0">
                    <img src="photo0" (click)="UploadPic0('photo0')"/>
                </div>      
            </div>

【问题讨论】：

您是否导入了表单模块？另外，我认为this.userId 不一定可用。
ControlValue 访问器是 view 和 control 之间的桥梁。 div默认没有实现任何controlValueaccessor，所以不能在div上放置ngModel，如果要使用div作为自定义控件则需要创建自定义contolValueAcessor 勾选这个：angular.io/api/forms/ControlValueAccessor
添加 import { FormsModule } from '@angular/forms' 无济于事...同样的错误。我还将 ngModel 移至：

标签： angular firebase angularfire2 ionic4

【解决方案1】：

通过删除 ngModule 并仅使用以下内容来消除错误：

            <div>
                <img [src]="photo0" (click)="UploadPic0('photo0')"/>
            </div>

【讨论】：

【解决方案2】：

标签“src”必须接收组件值。您可以在 img 标签中使用[src]="photo0" 或src="{{photo0}}"。

【讨论】：

在使用 [src]="photo0" 时仍然出现此错误：没有未指定名称属性的表单控件的值访问器

【解决方案3】：

你可以试试：

    <div>
        <div *ngIf="photo0 != ''">
            <img [src]="photo0" (click)="UploadPic0('photo0')"/>
        </div>      
    </div>

【讨论】：