Getting formControlName error even though I don't have a formControlNa

Question

I don't even have a formControlName at all but I keep getting this error:

core.js:6260 ERROR Error: formControlName must be used with a parent formGroup directive. You'll want to add a formGroup

directive and pass it an existing FormGroup instance (you can create one in your class).

This is all I have in my code:

shopping-cart.component.html

<form>

<div id="cartItemsList">

<ul>

<li *ngFor="let product of products">

<div>{{product.name }}</div>

<div><img src="../assets/images/gallery/{{product.thumbnail}}" /></div>

<div>{{product.price }}</div>

<button type="button" class="btnAddAction">Add to Cart</button>

</li>

</ul>

</div>

</form>

shopping-cart.component.ts

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

import { AngularFireDatabase, AngularFireList } from 'angularfire2/database';

import { Observable } from 'rxjs';

import * as firebase from 'firebase/app';

@Component({

selector: 'app-shopping-cart',

templateUrl: './shopping-cart.component.html',

styleUrls: ['./shopping-cart.component.scss']

})

export class ShoppingCartComponent implements OnInit {

products: any[];

constructor(public db: AngularFireDatabase){

db.list('/products')

.valueChanges().subscribe(products=>{

this.products=products;

});

}

ngOnInit(): void {

}

}