Error: Property binding ngForOf not used by any directive on an embedded template . El error ocurre específicamente debido al * en ngFor. Si elimino el '*' y solo pongo 'ngFor', aparece el error 'Identifier 'recipe' is not defined.' 'recetas' es una variable miembro de clase en mi archivo TS.

Este es mi código html:

 <a href="#" class="list-group-item clearfix" *ngFor="let recipe of recipes"> <div class="pull-left"> <h4 class="list-group-item-heading">{{ recipe.name }}</h4> <p class="list-group-item-text">{{ recipe.description }}</p> </div> </a>

Esto es lo que tengo en mi archivo TS:

 export class RecipeListComponent implements OnInit { recipes: Recipe[] = [ new Recipe( 'A Test Recipe', 'this is simply a test', 'https://delightfuladventures.com/wp-content/uploads/2019/10/vegan-stuffed-sweet-potatoes-recipe.jpg' ), new Recipe( 'A Test Recipe 2', 'this is simply a test', 'https://delightfuladventures.com/wp-content/uploads/2019/10/vegan-stuffed-sweet-potatoes-recipe.jpg' ), ]; constructor() {} ngOnInit(): void {} }