Book Image

Responsive Web Design with AngularJS

By : Sandeep Kumar Patel
Book Image

Responsive Web Design with AngularJS

By: Sandeep Kumar Patel

Overview of this book

<p>AngularJS is an open source JavaScript framework, built to create dynamic web applications using HTML, JavaScript, and CSS. AngularJS has many advanced features that can be used to leverage responsive application development.</p> <p>Responsive Web Design with AngularJS follows a detailed step-by-step approach to explain each key concept, with sufficient code and examples. This book will teach you how to implement dynamic routing, responsive custom directives, and breakpoints for your web page, followed by a section on debugging and testing.</p> <p>By the end of the book, you will be able to develop and design exciting single page applications with AngularJS and make the applications responsive on different devices. With ample screenshots and code offering you a detailed insight, this book will ensure your success in developing responsive applications.</p>
Table of Contents (12 chapters)
Responsive Web Design with AngularJS
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Directives


Directives are the building blocks of AngularJS framework. They work as a marker and are used by web developers in different places of application code. When the AngularJS framework loads, it reads these directives and takes appropriate actions. A directive can be used as an Attribute (A), an Element (E), a Class(C), and a Comment (M) inside DOM. The following diagram shows the element and types of directives:

Before going into the implementation of directives for responsive web application, let's discuss a few helpful concepts and features of AngularJS. These new concepts are really useful in responsive application development, as follows:

  • The $window service

  • The $watch method

  • The event binding function

  • The $log service

The $window service

AngularJS provides the $window service inside the ng module. As you know, JavaScript also provides the $window object, which contains information about the browser. In the AngularJS framework, the same window object is served with a $window wrapper...