Cannot assign to read only property '0' of object '[object Array] primeng

Discussão em 'Angular' iniciado por Piumi ganegoda, Julho 15, 2025.

  1. I want to sort the data table column but, it doesn't work. below is the code and error I get.when I give a server call to backend from typescript it works. When I use state Management the sorting doesn't work.

    [​IMG]

    <th *ngFor="let col of columns" [pSortableColumn]="col.field" [ngSwitch]="col.field">
    {{col.header}}
    <p-sortIcon [field]="col.field" ariaLabel="Activate to sort"
    ariaLabelDesc="Activate to sort in descending order" ariaLabelAsc="Activate to sort in ascending order"></p-sortIcon>
    </th>


    [​IMG]

    device.action

    export class LoadDeviceFail implements Action {
    readonly type = DeviceMgtActionTypes.LOAD_DEVICE_FAIL;
    constructor(public payload: string) { }
    }
    export class LoadDevices implements Action {
    readonly type = DeviceMgtActionTypes.LOAD_DEVICES;
    constructor() { }
    }
    export class LoadDevicesSuccess implements Action {
    readonly type = DeviceMgtActionTypes.LOAD_DEVICES_SUCCESS;
    constructor(public payload: DeviceModel[]) { }
    }


    device.effect

    @Effect()
    loadDevices$ = this.action$.pipe(
    ofType(
    deviceMgtActions.DeviceMgtActionTypes.LOAD_DEVICES
    ),
    switchMap((action: deviceMgtActions.LoadDevices) => this.restApiService.getAll('/iot/Devices/AllDevices').pipe(

    mergeMap((devices: DeviceModel[]) => [
    new deviceMgtActions.LoadDevicesSuccess(devices),
    new deviceMgtActions.ShowLoader(false),
    ]),
    catchError((error) =>
    of(
    new deviceMgtActions.LoadDevicesFail(error),
    new deviceMgtActions.ShowLoader(false)
    )
    )
    )
    )
    );


    device.reducer

    switch (action.type) {
    case DeviceMgtActionTypes.LOAD_DEVICES_SUCCESS:
    return {
    ...state,
    devices: action.payload,
    error: '',
    };
    case DeviceMgtActionTypes.LOAD_DEVICES_FAIL:
    return {
    ...state,
    devices: [],
    error: action.payload,
    };


    devices.ts

    getDevices(): void {
    this.store.dispatch(new deviceMgtActions.ShowLoader(true));
    this.store.dispatch(new deviceMgtActions.LoadDevices());
    }


    constructor

    constructor(private store: Store<fromDeviceMgt.State>)
    this.store.pipe(select(fromDeviceMgt.getDevices),
    takeWhile(() => this.componentActive))
    .subscribe((devices: DeviceModel[]) => {
    this.devices = devices;});
    }

    Continue reading...

Compartilhe esta Página