SmartNgRX Documentation

Home
Using @smarttools/smart-ngrx
Intro Effects Service Injection Token Entity Definitions Global Registration Entity Registration ChildDefinition Smart Selector
Mark and Delete
Introduction MarkAndDeleteInit Global Mark and Delete Entity Mark and Delete
Child Fields
CRUD Support
Retrieving Rows Virtual IDs Updates Create (Add) a Row Delete a Row
Using With Existing Selectors WebSockets Error Handling
Using @smarttools/smart-signals
Intro Effects Service Injection Token Entity Definitions Global Registration Entity Registration ChildDefinition Smart Signals
Mark and Delete
Introduction MarkAndDeleteInit Global Mark and Delete Entity Mark and Delete
Child Fields
CRUD Support
Retrieving Rows Virtual IDs Updates Create (Add) a Row Delete a Row
Using With Existing Signals WebSockets Error Handling
NgRX Demo Walkthrough
Introduction Database Structure Retrieving Data Setup Client Side Effects Services Selectors Tree Component Updating Fields Adding Rows Deleting Rows Processing WebSocket Messages
Signals Demo Walkthrough
Introduction Database Structure Retrieving Data Setup Client Side Effects Services Smart Signals (Selectors) Tree Component Updating Fields Adding Rows Deleting Rows Processing WebSocket Messages
API
Smart NgRX API Smart Signals API Internal API API Changes
NgRX Demo Walkthrough Updating Fields

Updating Fields

We trigger editing of the node labels by clicking on the edit icon which triggers our editNode() method in the tree.component.ts file.

Notice that we save which node we are editing so that if a repaint occurs, we don't stop editing. We also save off the current content so that if we cancel out of the edit, we can set things back to the way they were.

This then loads our edit component that we've created where we can make the changes. If we press ESC while editing, it fires our cancelEdit() method which sets everything back to the way it was.

When we press ENTER, it triggers our saveNode() method. This undoes the edit state of our presentation and then stores the editingContent field into the node's name field. Updating the node's name field optimistically updates the field and eventually triggers the Effects Service to update the server.

Previous
Tree Component
Next
Adding Rows