Repository files navigation

Thisscreencast examines some of the more advanced features in Angular, specifically Directives and how we can leverage the power of custom elements and attributes to map Domain Specific concepts through HTML, translate those into Value Objects in our Domain, and gain rendered simple HTML output. Also discussed: complexity, creating a DSL with directives, debugging techniques, tips and tricks.

If you're interested in some more context prior to watching check out my otherangular screencasts and an earlier post on thepower of web components as abstractions; this screencast covers:

• html as a dsl
• abstractions in html
• $compile
• $templateRequest
• $templateCache
• directive definition object
• requiring other directives
• directive communication ($scope.$broadcast, $scope.$on)

I like to use the npm moduleserve for running a simple static webserver for projects like this:

npm i -g servegit clone git@github.com:davemo/advanced-directives-with-angular-js.gitcd advanced-directives-with-angular-jsserve

Some things in the screencast aren't complete and some things could definitely done better. This section is a challenge to you, the reader/watcher to improve the code and level up your knowledge in the process! Try and tackle some of these challenges if you want:

• Bugfix: the editor currently shows up multiple times, fix it so this doesn't happen (hint: maybe an 'edit' state that's tracked could help the directive know if it should execute.insertAfter)
• Feature: make the expandy arrow thing point down when expanded and to the right when collapsed.