I just committed a big change to the AngularJS CRUD Grid – Lookup Tables!
Here’s what’s included:
- Lookup tables: You can now specify that a column is a lookup column. The directive will retrieve the data for that lookup table and manage it states
- AngularJS 1.2 RC3, Font Awesome
- Refactored the way I’m hiding and showing UI elements with ng-switch
- Added form-control class to form elements and modified the layout to use container and rows.
- Added a clear button to the filter control
- Clicking on a row’s text puts that row into edit mode. That way you don’t have to move mouse all the way over to the left to edit a row. Just click on any of the row’s text fields.
The most interesting thing about this release is the use of $broadcast and $on to push events from one directive to another. That way when I update data in the Place table that is immediately reflected in the Person table’s Place dropdown.
I get a reference to the document scope:
Then issue a broadcast call after data has been updated. I pass $broadcast the table name so that my other directives don’t refresh all lookup tables.
I then listen for the ‘lookupDataChange’ event and refresh the lookup data:
You define the lookup attributes for the column in the directive element:
See Index.html for a working example.
I’m happy with the way this turned out. I hope you are too.