SerÃa interesante que las piezas de código que tiene guardadas asà como los archivos finales estén en los recursos de la clase
Introducción
Presentación
Prerrequisitos
¿Qué es WebAssembly y Blazor?
Creando un proyecto de Blazor en Visual Studio
Creando un proyecto de Blazor con el CLI
Analizando extensiones de Visual code para blazor
Componentes de Blazor
Estructura de componentes y arquitectura en Blazor
Ciclo de vida en componentes y parámetros
Creando componentes compartidos
Creando archivo de configuración
Conectando Blazor a Backend
Configurando conexión al backend para el proyecto
Creando componentes para conexión a la API
Mostrando lista de productos
Creando Menú y CSS para la lista de productos
Creando formulario para agregar registros
Integrando formulario con servicios
Usando LibrerÃas de Blazor
Creando funcionalidad de eliminar usando JavaScript
Usando LibrerÃas de Blazor
Cierre
Conclusión y cierre
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
No se trata de lo que quieres comprar, sino de quién quieres ser. Aprovecha el precio especial.
Antes: $249
$209
Paga en 4 cuotas sin intereses
Termina en:
14 DÃas
12 Hrs
26 Min
44 Seg
Integrando formulario con servicios
16/19Recursos
Aportes 9
Preguntas 3
Ordenar por:
addProduct.razor
@page "/addproduct"
@inject IProductService productService;
@inject ICategoryService categoryService;
@inject NavigationManager NavigationManager;
<PageTitle>Add - Product</PageTitle>
<ModuleTitle Title="Add product"/>
<button class="btn btn-dark" @onclick="@(()=> NavigationManager.NavigateTo("/product"))"> Go back products</button>
<EditForm Model="@product" OnSubmit="@Save">
<div class="row">
<div class="col-8 form-group">
<label for="title" class="col-form-label"> Title</label>
<InputText id="title" @bind-Value="product.Title" required class="form-control"/>
</div>
<div class="col form-group">
<label for="price" class="col-form-label">Price</label>
<InputNumber id="price" @bind-Value="product.Price" min="0" required class="form-control" />
</div>
</div>
<div class="row">
<div class="col form-group">
<label for="category" class="col-form-label">Category</label>
<InputSelect id="category" @bind-Value="product.CategoryId" required class="form-control">
<option>Select Category...</option>
@foreach (var category in categories)
{
<option value="@category.Id">@category.Name</option>
}
</InputSelect>
</div>
<div class="col form-group">
<label for="image" class="col-form-label">Image (Url)</label>
<InputText id="image" @bind-Value="product.Image" required class="form-control" />
</div>
</div>
<div class="form-group">
<label for="description" class="col-form-label">Description</label>
<InputTextArea id="description" @bind-Value="product.Description" required class="form-control"></InputTextArea>
</div>
<hr />
<button class="btn btn-primary" type="submit">Save</button>
</EditForm>
@code{
private Product product=new();
private List<Category> categories = new List<Category>();
protected override async Task OnInitializedAsync()
{
categories = await categoryService.Get();
}
private async Task Save()
{
product.Images = new string[1] { product.Image };
await productService.Add(product);
NavigationManager.NavigateTo("/product");
}
}
creo que en este curso falta el tema de como depurar el proyecto, fundamental para cuando ocurre un error y ver que está pasando
En mi caso para que funcionara, fue necesario cambiar los nombres del modelo Product, ya que en la Api los atributos son en minusculas, por si no les muestra las categorias y no permite guardar productos.
Me respondo ;)
El cogio me pide `@using BlazorApp1.Models;` es necesario? no estoy seguro por que no lo veo en el codigo de la clase. Y si no se incluye, como se hace el llamada del modelo en la instanciacion:
`private Product product = new();`
pienso igual deberia estar en el recurso de clase, me sale error en categoria en la lista..no se si esta caida la API de categoria, o cual es la falla
A lot of issues with the code in this cool course, for example, the result of the Product Module is below, at least in Nov 2023. (Maybe the api changed or idk).
```js
namespace BlazorApp1.Models
{
public partial class Product
{
public long Id { get; set; }
public string Title { get; set; }
public long Price { get; set; }
public string Description { get; set; }
public Uri[] Images { get; set; }
public DateTimeOffset CreationAt { get; set; }
public DateTimeOffset UpdatedAt { get; set; }
public Category Category { get; set; }
}
}
```namespace BlazorApp1.Models
{
public partial class Product
{
public long Id { get; set; }
public string Title { get; set; }
public long Price { get; set; }
public string Description { get; set; }
public Uri\[] Images { get; set; }
public DateTimeOffset CreationAt { get; set; }
public DateTimeOffset UpdatedAt { get; set; }
public Category Category { get; set; }
}
}
Todo muy claro.
Gracias profe.
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?