It can be hard to maintain a balance between visual elements of an application associated with HTML and CSS and aspects such as UI Interaction and form validation. Wouldn't it be great if you could use HTML as your own domain specific language (DSL) and have it be a custom thing tuned exactly to the elements and attributes you need for the project you're building?
AngularJS provides this exact solution by separating these two features so that you can make changes in the visual layout without affecting your code. Backed by directives, AngularJS will help you to add functionality to HTML so that you can build interactive, engaging web applications.
Directives help you to extend your HTML and teach it new tricks to visually enhance your websites without compromising your code. This video course covers everything you need to use directives in your own apps, from creating directives to isolating their scope, applying transclusion, and injecting dependencies.
Firstly, we will learn how to include HTML snippets in our code using directives and create a directive to start working with it. We will use isolate scope to configure our directives individually and style them. Next, we will take a look at different operators to bind functions and make our directives interactive. We will explore the concept of transclusion and apply it to make our code more effective. Once we've done this, we will restrict our directives to be used as an element, attribute, class or a comment according to our needs. We will also discover the difference between link and controller functions and inject dependencies to create testable components and co-ordinate our directives to work together. By the end of this course, you'll be proficient with creating and using fully functional directives to your advantage.
This course explains the various concepts of AngularJS directives step-by-step, with a hands-on approach and examples to help you understand and use directives in your code.
About the Author
This first video will provide information about what we are going to cover in this course.
Including snippets of HTML can be done in many ways, but an AngularJS directive is one of the best.
Getting started with directives seems difficult. We will show you that a basic directive is only a handful of code.
Directives often need to be individually configured. By having an isolate scope on the directive, it's easy to do so.
We want to be able to create attributes on our directives. Understanding the two most common kinds of bindings makes this easy.
Understanding the basics of scope isn't always enough. You'll learn just a few more things to become power users of scope.
Transclusion is poorly understood (and sometimes poorly explained). The solution is a simple, straightforward explanation and demonstration.
Transclusion is important, and people need to be comfortable with it. We demonstrate it further by building a UI element and a variety of content for it.
Directives can be declared in multiple ways, but it might not be clear how to restrict that. Explaining the different kinds of directive restrictions helps.
You can't accomplish everything you need to do in directives with just the scope and templates. We'll introduce functions you can add to handle everything else.
Sometimes, you will want to service or data in your directives. Dependency injection will come to the rescue, but some functions don't need it.
Understanding small snippets of code isn't the same as understanding a complete program. So, we look at a working program with more moving pieces.
Sometimes, we want directives to do more than just wrap one another. We'll use require to get access to another directive.
It's great to understand "require" from an explanation point of view, but it's better to see it being put to use.
Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.
With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.
From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.
Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.