Angular NGXS调度运行状态的所有操作
我对NGX和分派函数有一个奇怪的问题。当我在dispatch函数中创建Action类的新实例时,所有函数w annotation@Action都将被执行。有人知道为什么吗 这是我的产品Angular NGXS调度运行状态的所有操作,angular,ngxs,Angular,Ngxs,我对NGX和分派函数有一个奇怪的问题。当我在dispatch函数中创建Action类的新实例时,所有函数w annotation@Action都将被执行。有人知道为什么吗 这是我的产品 export class ProductStateModel { public pageProduct: PageProduct; public page: number; public size: number; public productDetails: Product; }
export class ProductStateModel {
public pageProduct: PageProduct;
public page: number;
public size: number;
public productDetails: Product;
}
@State<ProductStateModel>({
name: 'product',
defaults: {
pageProduct: {},
page: 0,
size: 10,
productDetails: null
}
})
export class ProductState {
constructor(public productController: ProductControllerService) { }
@Action(CreateProductAction)
createProduct(ctx: StateContext<ProductStateModel>, { name, ean13, description, blob, price, quantity }: CreateProductAction) {
console.log('createProduct')
if (name) {
return this.productController.saveProductUsingPOST({ product: { name, ean13, description, price, quantity }, multipartFile: blob }).pipe(
tap(response => console.log(response))
)
}
}
@Action(LoadProductsPageAction)
loadProductPage(ctx: StateContext<ProductStateModel>, { page, size }: LoadProductsPageAction) {
console.log('loadProductPage')
if (page != null)
return this.productController.getProductPageUsingGET({ size, page }).pipe(
tap(response => ctx.patchState({ pageProduct: response, page, size }))
)
}
@Action(DeleteProductAction)
deleteProduct(ctx: StateContext<ProductStateModel>, { id }: DeleteProductAction) {
console.log('deleteProduct')
if (id != null)
return this.productController.removeByProductIdUsingDELETE(id).pipe(
tap(response => {
const page = ctx.getState().page
const size = ctx.getState().size
ctx.dispatch(new LoadProductsPageAction(page, size))
})
)
}
@Action(GetProductDetailsAction)
getProductDetails(ctx: StateContext<ProductStateModel>, { id }: GetProductDetailsAction) {
console.log('getProductDetails')
return this.productController.findByIdProductUsingGET(id).pipe(
tap(response => ctx.patchState({ productDetails: response })
))
}
每次在dedux控制台中,我都会看到更新操作,但我没有它您的所有操作都没有定义
类型,并且很可能与所有@action()
装饰器匹配
更改此项:
导出类LoadProductsPageAction{
静态只读类型:“[Products]LoadProductPageAction”;
构造函数(公共页:编号,公共大小:编号){}
}
为此:
导出类LoadProductsPageAction{
静态只读类型:字符串=“[Products]LoadProductPageAction”;
//^^^^^必须指定一个值
构造函数(公共页:编号,公共大小:编号){}
}
您没有为类型
属性分配字符串值。您的所有操作都没有定义类型
,并且很可能与所有@Action()
装饰符匹配
更改此项:
导出类LoadProductsPageAction{
静态只读类型:“[Products]LoadProductPageAction”;
构造函数(公共页:编号,公共大小:编号){}
}
为此:
导出类LoadProductsPageAction{
静态只读类型:字符串=“[Products]LoadProductPageAction”;
//^^^^^必须指定一个值
构造函数(公共页:编号,公共大小:编号){}
}
您没有为类型
属性指定字符串值。显示您的源代码。@reactular addddo您的操作是否共享基类?如果没有看到代码,我猜您的操作
定义中有错误-您确定每个操作都有唯一的类型
属性吗?这就是它们被识别的方式。为什么被否决?向我们展示您的源代码。@Reactgular Addddo您的操作是否共享基类?如果没有看到代码,我猜您的操作定义中有一些错误-您确定每个操作都有一个唯一的类型属性吗?这就是他们被识别的方式。为什么被否决?很酷,所以我在正确的轨道上重新:type
。。我们已经做过几次了,当剪切/粘贴操作并忘记更新type属性时。很酷,所以我在re:type
上走的是正确的道路。。在剪切/粘贴操作并忘记更新type属性时,我们已经做过几次了。
export class LoadProductsPageAction {
static readonly type: '[Products] LoadProductPageAction';
constructor(public page: number, public size: number) { }
}
export class CreateProductAction {
static readonly type: '[Products] CreateProductAction';
constructor(public name: string, public ean13: string, public description: string, public price: number, public quantity: number, public blob: Blob) { }
}
export class DeleteProductAction {
static readonly type: '[Product] DeleteproductAction';
constructor(public id: number) { }
}
export class GetProductDetailsAction {
static readonly type: '[Product] GetProductDetailsAction';
constructor(public id: number) { }
}