Here’s what I did in a nutshell:
1. Moved all the angular code to the /Scripts folder:
2. app.js only contains this one line of code to initialize the app:
3. I put the notification factory under /Services
4. I created the crud-grid-directive.js file and put the directive code. I renamed person to object so that we can reuse the directive for multiple tables.
scope: true – tells angular to create a new scope for each instance of the directive
$attrs.tableName is set in the view…see how below.
5. Moved the factory code to /Directives/Services. It now accepts a type and builds the URL from that so we can reuse for multiple tables.
6. As you can see in the code above I created a new template for the directive in Directives/Templates called crud-grid-directive-template.html, which contains the HTML markup that the grid will render.
7. Now all that is left in the view is this, which defines two crud grids and assigns the corresponding tables.
(I also created a new “Place” model and controller)
Hope this helps you ramp up on AngularJS directives.