angular-redux/store

ngModel is changing store values

rs200x opened this issue · 0 comments

This is a...

  • feature request
  • [x ] bug report
  • [x ] usage question

What toolchain are you using for transpilation/bundling?

  • [x ] @angular/cli
  • Custom @ngTools/webpack
  • Raw ngc
  • SystemJS
  • Rollup
  • Other

Environment

NodeJS Version:
Typescript Version: 2.7.2
Angular Version: 6
@angular-redux/store version: 9.0.0
@angular/cli version: (if applicable) 6.1.2
OS: Win10

Link to repo showing the issus

(optional, but helps a lot)

Expected Behaviour:

Value binding with ngModel should not change object value in store.

Actual Behaviour:

I have a selection which is getting me an array from store

export class Feature {
    public type: number;
    public value: number;
}

nodeFeatures$: Observable<Feature[]>;
this.nodeFeatures$ = this.store.select<Feature[]>(['nodes', 'id', 'features']);

This is bound to a mat-table where the value cell is defined as input to allow the user to directly change the value.

    <table #table mat-table [dataSource]="nodeFeatures$" class="table-hover">

      <ng-container matColumnDef="value">
        <th mat-header-cell *matHeaderCellDef> Value </th>
        <td mat-cell *matCellDef="let element">
            <input class="form-control" type="number" [(ngModel)]="element.value">
        </td>
      </ng-container>

      <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
      <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
    </table>

Right now the view containing the table is not defined as form.
There will be a save/submit button where I want to get all the feature items with changed values.
While implementing the logic for comparing the items ob the observable against the items in the store I realized that values already got updated without any change notification.

Is this by design and the usage of ngModel or am I doing something wrong?
I would have expected that the store.select always returns me a copy.