Home Page Icon
Home Page
Table of Contents for
Cover
Close
Cover
by Gion Kunz
Mastering Angular 2 Components
Mastering Angular 2 Components
Table of Contents
Mastering Angular 2 Components
Credits
About the Author
About the Reviewer
www.PacktPub.com
eBooks, discount offers, and more
Why subscribe?
Preface
What this book covers
What you need for this book
Who this book is for
Conventions
Reader feedback
Customer support
Downloading the example code
Downloading the color images of this book
Errata
Piracy
Questions
1. Component-Based User Interfaces
Thinking of organisms
Components – The organs of user interfaces
Encapsulation
Composability
Components, invented by nature
My UI framework wishlist
Time for new standards
Template elements
Shadow DOM
Angular's component architecture
Everything is a component
Your first component
JavaScript of the future
I speak JavaScript, translate, please!
Classes
Modules
Template strings
ECMAScript or TypeScript?
Decorators
Tools
Node.js and NPM
SystemJS and JSPM
JSPM
Getting started with JSPM
Summary
2. Ready, Set, Go!
Managing tasks
Vision
Starting from scratch
Bootstrapping
Running the application
Recap
Creating a task list
Recap
The right level of encapsulation
Recap
Input generates output
Recap
Custom UI elements
Recap
Filtering tasks
Summary
3. Composing with Components
Data – Fake to real
Reactive programming with observable data structures
Immutability
Pure components
Purifying our task list
Recap
Composition using content projection
Creating a tabbed interface component
Recap
Mixing projected with generated content
Summary
4. No Comments, Please!
One editor to rule them all
Creating an editor component
Recap
Building a commenting system
Building the comment component
Building the comments component
Recap
Summary
5. Component-Based Routing
An introduction to the Angular router
Composition by routing
Router versus template composition
Understanding the route tree
Back to the routes
Routable tabs
Refactoring navigation
Summary
6. Keeping Up with Activities
Creating a service for logging activities
Logging activities
Leveraging the power of SVG
Styling SVG
Building SVG components
Building an interactive activity slider component
Projection of time
Rendering activity indicators
Bringing it to life
Recap
Building the activity timeline
Summary
7. Components for User Experience
Tag management
Tag data entity
Generating tags
Creating a tags service
Rendering tags
Integrating the task service
Completion of the tags service
Supporting tag input
Creating a tag input manager
Creating a tags select component
Integrating tag input within the editor component
Finishing up our tagging system
Drag and drop
Implementing the draggable directive
Implementing a drop target directive
Integrating drag and drop in task list component
Recapitulate on drag and drop
To infinity and beyond!
The asterisk syntax and templates
Creating an infinite scroll directive
Detecting change within our template directive
Adding and removing embedded views
Finishing our infinite scroll directive
Summary
8. Time Will Tell
Task details
Enabling tags for tasks
Managing efforts
The time duration input
Components to manage efforts
The visual efforts timeline
Recapitulating on efforts management
Setting milestones
Creating an autocomplete component
Summary
9. Spaceship Dashboard
Introduction to Chartist
Projects dashboard
Creating the projects dashboard component
Project summary component
Creating your first chart
Visualizing open tasks
Creating an open tasks chart
Creating a chart legend
Making tasks chart interactive
Summary
10. Making Things Pluggable
Plugin architecture
Pluggable UI components
Implementing the plugin API
Instantiating plugin components
Finalizing our plugin architecture
Building an Agile plugin
Agile task info component
Agile task details component
Recapitulating on our first plugin
Managing plugins
Loading new plugins at runtime
Summary
11. Putting Things to the Test
An introduction to Jasmine
Writing our first test
Spying on component outputs
Utilities to test components
Injecting in tests
Test component builder
Testing components in action
Testing component interaction
Testing our plugin system
Summary
A. Task Management Application Source Code
Download
Prerequisites
Usage
Troubleshooting
Cleaning IndexDB to reset data
Enabling web components in Firefox
Index
Search in book...
Toggle Font Controls
Playlists
Add To
Create new playlist
Name your new playlist
Playlist description (optional)
Cancel
Create playlist
Sign In
Email address
Password
Forgot Password?
Create account
Login
or
Continue with Facebook
Continue with Google
Sign Up
Full Name
Email address
Confirm Email Address
Password
Login
Create account
or
Continue with Facebook
Continue with Google
Next
Next Chapter
Table of Contents
Add Highlight
No Comment
..................Content has been hidden....................
You can't read the all page of ebook, please click
here
login for view all page.
Day Mode
Cloud Mode
Night Mode
Reset