Watch Later

Watch User Created Playlist (96)

This playlist is user created.

pro-course-rss-logo

PRO RSS Feed

Basic Binding in AngularJS

P

The Dot

P

Sharing Data Between Controllers

P

Defining a Method on the Scope

P

Filters

P

Unit Testing AngularJS

P

ngRepeat and Filtering Data

P

Built-in Filters

P

First Directive

P

Directive Restrictions

P

Basic Behaviors

P

Useful Behaviors

P

Directives Talking to Controllers

P

Directive to Directive Communication in AngularJS

P

Understanding Isolate Scope

P

Isolate Scope "@"

P

Isolate Scope "="

P

Isolate Scope "&"

P

Transclusion Basics

P

An Alternative Approach to Controllers

P

Thinking Differently About Organization

P

Building Zippy

P

angular.element

P

$scope vs. scope

P

templateUrl

P

$templateCache

P

ng-view

P

The config function

P

$routeProvider api

P

$routeParams

P

redirectTo

P

Basic Promises in AngularJS

P

Resolve

P

resolve conventions

P

resolve $routeChangeError

P

Directive for Route Handling

P

Route Life Cycle

P

Providers

P

Injectors

P

Components and Containers

P

ng-repeat and $index, $event, $log

P

Experimental "Controller as" Syntax

P

Directive Communication

P

ngmin

P

ng-repeat-start

P

animation basics

P

Animating with JavaScript

P

Animating the Angular Way

P

angular.copy

P

Introduction to ui-router

P

Using angular.bootstrap to Initialize Your App

P

No Custom Markup

P

Unit Testing "Hello World"

P

Unit Testing a Directive

P

Unit Testing Directive Scope

P

Testing Underscores

P

Testing a Controller

P

transformResponse

P

$q.all

P

Using $resource for Data Models

Build a Debug Directive

P

File Uploads

P

Create a Scope Decorator

P

Get Started with Firebase and AngularFire

P

Write Your First Directive

P

Intro to ES6 and traceur compiler

P

Arrow Function => in ES6

Model Validation Design Review

P

Using ngModelOptions to Update on Blur

P

Creating Demo APIs with json-server

Taking control of your templates using $templateCache

P

Creating an Ionic App

P

Install Ant for Ionic

P

Ionic Quickstart for Windows: Installing Ionic

P

Install Android SDK for Ionic

P

Install the Genymotion Android Emulator for Ionic

P

Install the Java Developer Kit (JDK) for Ionic

P

Run Your First Ionic App

P

Edit Your Ionic Application Code

P

Deploy Your Ionic App to a Device

P

Angular with Webpack - Uglifying your JavaScript

P

Angular Automation: Gulp Serve

P

Say "Hello World" to Angular 2

Create a Simple Angular 2 Component

Manage Angular 2 Elements with Events and Refs

Control Angular 2 Events with $event and Event Handlers

Share Services and Data with Angular 2 Dependency Injection

Provide and Share Values with Angular 2 Dependency Injection

Loop Through Angular 2 Components with ngFor

Sync Values from Inputs with Angular 2’s ngModel Two-Way Binding

Adding a data model

P

Template property syntax

P

Pass Values into Angular 2 Components with @Input

Write CSS Inside of Angular 2 Components

Use Global CSS Inside Angular 2 Components

Using Pipes to Filter Data

P
angularjs tutorial about Basic Binding in AngularJS

Basic Binding in AngularJS

1:27 angularjs PRO

Binding is a core feature of AngularJS. It provides a simple mechanism for integrating your HTML with your data via {{bracketed expressions}}. In this video, John covers the basics of binding to get you started.

angularjs tutorial about The Dot

The Dot

3:02 angularjs PRO

This brief video examines the importance of a single . within your AngularJS application. It uncovers a potential gotcha when it comes to inheritence.

angularjs tutorial about Sharing Data Between Controllers

Sharing Data Between Controllers

5:13 angularjs PRO

If AngularJS Controllers are the glue of an application, how do they communicate and pass data around? This introduction to service factories will shed some light on that question.

angularjs tutorial about Defining a Method on the Scope

Defining a Method on the Scope

2:16 angularjs PRO

Armed with Controllers and service factories, you'll probably want to do some work on the data to give your app behaviors. In this video we will look at providing that behavior by defining a method on the scope. This method will be bound within the HTML and update live as input changes.

Filters

2:19 angularjs PRO

Many times while building an AngularJS application you'll need to manipulate data, and it doesn't make sense to do it with a Controller method. Luckily you have Filters, which are particularly well suited for manipulating text within your HTML views. This handy tool uses a simple syntax to create highly reusable functionality for your apps.

angularjs tutorial about Unit Testing AngularJS

Unit Testing AngularJS

5:18 angularjs PRO

Testing is a first class citizen in AngularJS. It is at its heart and soul. This lesson demonstrates using Karma to write a simple unit test for a Filter.

angularjs tutorial about ngRepeat and Filtering Data

ngRepeat and Filtering Data

5:13 angularjs PRO

When working with sets of data, it is common to need to repeat the same UI element over and over again with values from each object in the set. ngRepeat provides an elegant and simple way to accomplish this within your HTML. We will also provide a filter to a repeater that gives us basic search functionality.

angularjs tutorial about Built-in Filters

Built-in Filters

2:13 angularjs PRO

AngularJS comes with several handy filters that you can use out of the box. These filters can be combined to create more complex filtered results.

angularjs tutorial about First Directive

First Directive

2:08 angularjs PRO

Directives might just be the killer feature of AngularJS. Directives allow us to extend the grammar of the web through reusable HTML elements, attributes, and classes.

angularjs tutorial about Directive Restrictions

Directive Restrictions

3:01 angularjs PRO

By default AngularJS directives can be used with elements, attributes, classes, and comments. Many times we want to restrict it to one or more of those to control how a directive will be used. This lesson digs into how and why to use Directive restrictions.

angularjs tutorial about Basic Behaviors

Basic Behaviors

3:29 angularjs PRO

Bring your directives to life with custom behaviours. This is the recommended way of interacting with the DOM in AngularJS. If you find yourself modifying the DOM inside of your controllers (bad), directive behaviours are your solution (awesome).

Useful Behaviors

2:55 angularjs PRO

When you define a directive you get access to the attrs object by declaring it as a dependency in the link function. The attrs object will contain the normalized attributes and their corresponding values declared on the element which contains the directive in the html. So if you set a value on your directive attribute (myDirective="value"), you can access this value in your directive configuration by accessing attrs.myDirective, as this contains the value set in the html for myDirective.

Directives Talking to Controllers

4:43 angularjs PRO

Often in AngularJS we want to share information between controllers and directives. One way to do this is by passing the scope, but this makes the directive reliant on the scope having the methods you want to run. This lesson shows you a cleaner way that you can pass methods to the directive using an attribute and decouple controllers from directives. This in turn makes your directives more generic/reusable.

Directive to Directive Communication in AngularJS

8:01 angularjs PRO

In Angular JS, you can use one directive as an element and other directives as attributes to the element, allowing you to specify different functionality for elements based on the attributes in the element. This lesson shows you how to take a group of directive elements and give them each unique functionality based on their directive attributes.

angularjs tutorial about Understanding Isolate Scope

Understanding Isolate Scope

6:38 angularjs PRO

By adding an isolated scope object to your AngularJS directive you can insure that each element using that directive has its own scope. This prevents it from affecting sibling directives and encapsulates the directive.

Isolate Scope "@"

4:51 angularjs PRO

AngularJS isolate scopes can be a bit cryptic when you are first starting out. In this lesson, John looks at the attribute or "@" designator in your isolate scopes.

Isolate Scope "="

2:51 angularjs PRO

Perhaps the most useful of the isolate scope binding methods, this episode talks about the use of "=" for two way binding within your directives.

angularjs tutorial about Isolate Scope "&"

Isolate Scope "&"

6:03 angularjs PRO

The "&" in your isolated scopes within your AngularJS application will allow you to invoke a method within the scope that your directive lives in.

angularjs tutorial about Transclusion Basics

Transclusion Basics

2:48 angularjs PRO

Uh oh. Transclusion? What the heck? It's a big word, but it is actually a very simple concept. In this episode John shows you how transclusion is used in your AngularJS directives...

An Alternative Approach to Controllers

2:49 angularjs PRO

AngularJS makes your HTML very declarative. However, seeing the functions invoked in your HTML may not offer any clues as to what controller defines said functions. This video offers an approach to solving this problem by returning the controller in the controller definition so that we can opt for something like ng-click="SomeCtrl.doesSomething()" instead of simply writing ng-click="doesSomething()".

Thinking Differently About Organization

4:22 angularjs PRO

Demonstrates an “outside the box” approach to organizing controllers and directives by collecting them into objects and them passing those object to AngularJS.

angularjs tutorial about Building Zippy

Building Zippy

7:55 angularjs PRO

Building a demo AngularJS directive named Zippy using ng-model, ng-click and transclusion (no controller)

angularjs tutorial about angular.element

angular.element

8:40 angularjs PRO

A brief overview of using element in an AngularJS directive, and how to target one without jquery, and also how to use replace and compile function

$scope vs. scope

9:14 angularjs PRO

This episode is explaining the naming conventions behind for the arguments passed to the factory functions for controllers, directives, linking functions, etc., its implications in regard to Angular’s dependency injection, minification side effects on arguments, and how to prevent them.

templateUrl

3:45 angularjs PRO

If you want to keep your template code in a separate html file, you can use the templateUrl property to tell Angular where to find it.

$templateCache

3:07 angularjs PRO

An alternative to inject an AngularJS template by using $templateCache, using .get() and .put() methods

ng-view

3:03 angularjs PRO

AngularJS's ngView is a directive that complements the $route service by including the rendered template of the current route into the main layout (typically the index.html) file. Every time the current route changes, the included view changes with it according to the configuration of the $route service.

angularjs tutorial about The config function

The config function

2:55 angularjs PRO

This episode explains the config phase of an AngularJS application and how is it special in regards to $routeProvider (routing configuration) and providers in general.

angularjs tutorial about $routeProvider api

$routeProvider api

1:50 angularjs PRO

AngularJS's $routeProvider has a very basic api for defining your application's routes. $routeProvider.when() is used to match a url pattern to a view while $routeProvider.otherwise() is used to render a view when there is no match to a url pattern.

$routeParams

2:14 angularjs PRO

John continues to dive into routing in AngularJS using ng-view. He provides some simple examples for passing in path parameters using $routeParams.

redirectTo

3:45 angularjs PRO

In AngularJS redirectTo is often assigned a simple static string and thus points invariably to one location (redirectTo: '/mypath'). You can customize this, by setting redirectTo as a function, which arguments are the route params. For instance, if you hit the route "/pizza/peperoni", you can compose your redirection to be "/pizzas", or whatever suits your needs

Basic Promises in AngularJS

4:03 angularjs PRO

An AngularJS promise is a mechanism that lets you defer a stated action or series of actions at an earlier point of time until you explicitly declare that promise to be fulfilled (or resolved). Promises are useful for asynchronous operations. This video introduces the basic way to declare and resolve promises.

angularjs tutorial about Resolve

Resolve

2:05 angularjs PRO

This video shows how the AngularJS 'resolve' feature can be used during the config phase before your controller has been instantiated. This gives you the opportunity to ensure everything has been setup properly that your controller depends on, thus allowing your controller to execute safely based on its assumptions.

angularjs tutorial about resolve conventions

resolve conventions

3:23 angularjs PRO

This video shows a more generalized way of using the AngularJS resolve feature with controllers to organize the conditions before the controller is instantiated. The video shows how to condition the controller's instantiation on more than one set of actions (function), and even pass values from the condition processing into the controller's scope once it gets instantiated.

resolve $routeChangeError

5:09 angularjs PRO

We can intercept a route change error and direct the user to an appropriate page.

Directive for Route Handling

3:02 angularjs PRO

Use AngularJS $rootScope within a directive to detect route change errors and display it to the user.

angularjs tutorial about Route Life Cycle

Route Life Cycle

4:24 angularjs PRO

In this lesson the the route life cycle, John steps through the AngularJS Route life cycle using the routeChangeStart and routeChangeSuccess events. By inspecting the current and previous objects, we can see Angular's awareness of the previous route and controller as well as the current or targeted route and controller. Through the use of the resolve property, the routeChangeSuccess event will be delayed until the promise has been completed.

angularjs tutorial about Providers

Providers

5:06 angularjs PRO

This lesson describes what is really happening when you use the angular
factory and how you can make your factories even more dynamic in creation.
This gets further into the internals of AngularJS by showing you how a factory is built dynamically for you and how they have reduced the plumbing you need to make applications.

Injectors

2:55 angularjs PRO

Injectors inject your dependencies in your AngularJS application. For the most part it will automatically work when constructing objects (controllers) and provide the dependencies defined with your service/factory/provider, it can also be injected itself and be used for invoking methods with injection.

angularjs tutorial about Components and Containers

Components and Containers

4:27 angularjs PRO

This lesson describes fundamentals for creating custom directives (broken down into Components and Containers). The component demonstrates how to use the service template to create a simple clock directive whereby AngularJS will bind with objects in the template property and access element attributes. The component example will provide a demonstration of how you can nest components and containers, taking advantage of AngularJS transclusion capabilities.

angularjs tutorial about ng-repeat and $index, $event, $log

ng-repeat and $index, $event, $log

4:48 angularjs PRO

$index and $event are handy shortcuts that allow you to access useful information directly in your views. $log facilitates configurable logging without using console.log directly.

angularjs tutorial about Experimental "Controller as" Syntax

Experimental "Controller as" Syntax

5:20 angularjs PRO

The "controller as" syntax was added to AngularJS 1.2. This syntax abstracts the use of $scope in controllers, simplifying the syntax of your controllers.

angularjs tutorial about Directive Communication

Directive Communication

4:28 angularjs PRO

In AngularJS, hierarchical directives have the ability to communicate with one another via their defined controllers. With simple syntax/notation you are able to define links between directives and their controllers.

angularjs tutorial about ngmin

ngmin

3:28 angularjs PRO

ng-min removes the headache of needing to associate strings with parameter names for minified AngularJS code.

angularjs tutorial about ng-repeat-start

ng-repeat-start

1:26 angularjs PRO

This short video tutorial looks at the ng-repeat-start and ng-repeat-end elements added in AngularJS 1.2

angularjs tutorial about animation basics

animation basics

3:52 angularjs PRO

Angular 1.2 introduces new animation functionality. This episode looks at the very basics of getting the animation module loaded and using it to create your first simple animation with CSS.

angularjs tutorial about Animating with JavaScript

Animating with JavaScript

3:45 angularjs PRO

In this lesson John looks at how to integrate the popular TweenMax library with ngAnimate to get animation effects in an AngularJS application.

angularjs tutorial about Animating the Angular Way

Animating the Angular Way

5:53 angularjs PRO

In this episode John uses TweenMax to add animations to AngularJS. Instead of manipulating DOM directly in a controller, we will use an AngularJS directive to abstract that view logic cleanly using $animate.

angular.copy

3:09 angularjs PRO

In this episode John takes a look at angular.copy and how you can use it for non-destructive form editing. Instead of binding to a value directly, we make a deep copy of that object and bind to the copy for presentation. Updates to the data are then "saved" to the original object to persist changes.

angularjs tutorial about Introduction to ui-router

Introduction to ui-router

4:35 angularjs PRO

In his debut egghead.io lesson, Joel will show you how to get setup and running with ui-router, an alternative to AngularJS's default routing module.

angularjs tutorial about Using angular.bootstrap to Initialize Your App

Using angular.bootstrap to Initialize Your App

1:13 angularjs PRO

In this lesson, John shows you how to use angular.bootstrap as an alternative approach to initializing your application without using ng-app.

No Custom Markup

1:39 angularjs PRO

Extending the semantics of HTML is one of the core features of AngularJS, however, you can use AngularJS without any custom markup.

Unit Testing "Hello World"

2:26 angularjs PRO

This brief intro to unit testing with AngularJS takes a look at how to configure a test, compile an element, and access AngularJS within your tests.

Unit Testing a Directive

2:14 angularjs PRO

In this lesson you will unit test a simple AngularJS directive

angularjs tutorial about Unit Testing Directive Scope

Unit Testing Directive Scope

1:57 angularjs PRO

Unit test your AngularJS directives that make changes to $scope as well as their own isolated scopes.

angularjs tutorial about Testing Underscores

Testing Underscores

1:27 angularjs PRO

AngularJS injectors understand aliased for core injectables such as $rootScope in unit tests. If you surround your injected object with underscores _$rootScope_ it will be understood and injected into your test by Angular. This allows you to use a local alias of the same name.

angularjs tutorial about Testing a Controller

Testing a Controller

1:12 angularjs PRO

AngularJS provides helpers for convenient testing of your application. In this lesson you will learn how to test a basic controller with Jasmine and Angular.

angularjs tutorial about transformResponse

transformResponse

4:01 angularjs PRO

In his debut lesson, Trevor test drives the transformation of a response from an external REST service using the the transformResponse option of AngularJS's $http service.

$q.all

2:35 angularjs PRO

Orchestrating the handling of multiple promises in AngularJS is simple if you take advantage of $q.all. Using $q.all will take your promises, wait until they have all resolved and return the result of all the promises as an ordered array.

angularjs tutorial about Using $resource for Data Models

Using $resource for Data Models

5:29 angularjs

AngularJS's $resource service allows you to create convenience methods for dealing with typical RESTful APIs. In this video, Brett will show you the basics of using $resource, as well as talking about some of the drawbacks with using this service for your data models.

Build a Debug Directive

4:00 angularjs PRO

Explore some interesting techniques with AngularJS directives to create a debug directive using termination, priority, and the $compile service.

File Uploads

7:42 angularjs PRO

The file input type is missing from the ng-model directive, so you need to "roll your own" solution for file uploads with AngularJS.

Create a Scope Decorator

4:30 angularjs PRO

Using Aspect Oriented Programming (AOP) techniques, you can easily decorate AngularJS controller methods to add additional behaviors. This can be useful for handling analytics and other common concerns in a typical application.

angularjs tutorial about Get Started with Firebase and AngularFire

Get Started with Firebase and AngularFire

6:10 angularjs PRO

Firebase provides a real-time syncing backend for your AngularJS applications in very few lines of code. In this lesson, you'll learn how to get started integrating it into your app.

angularjs tutorial about Write Your First Directive

Write Your First Directive

2:46 angularjs PRO

Write your very first directive! This lesson will show you how to declare a directive, and start using the "link" function to modify the behavior of an HTML element.

js tutorial about Intro to ES6 and traceur compiler

Intro to ES6 and traceur compiler

2:42 js PRO

es6 is the next generation of javascript. You can use it today with the traceur compiler library. Also be sure to check out es6fiddle to start playing with ECMAscript 6 right now.

js tutorial about Arrow Function => in ES6

Arrow Function => in ES6

2:57 js

ECMAscript 6 introduces the "arrow function" as a shortcut for creating anonymous functions with this scope bound.

angularjs tutorial about Model Validation Design Review

Model Validation Design Review

7:31 angularjs PRO

We want robust validation for our AngularJS models. This will require a bit of forethought, and this lesson will examine the goals that we have for the validation piece of our model library.

angularjs tutorial about Using ngModelOptions to Update on Blur

Using ngModelOptions to Update on Blur

2:56 angularjs PRO

How do you change a text input from updating on every key stroke? With ngModelOptions it is really easy to control what event triggers the model update. In this lesson, we will modify a text input to update on blur instead of key up.

node tutorial about Creating Demo APIs with json-server

Creating Demo APIs with json-server

6:02 node

json-server makes it extremely easy to setup robust JSON apis to use for demos and proof of concepts. John walks you through the process of using pre-built json files for a server and how to generate larger datasets using lodash and faker.

angularjs tutorial about Taking control of your templates using $templateCache

Taking control of your templates using $templateCache

3:09 angularjs PRO

Learn how Angular stores and retrieves templates, and some tricks for making it more flexible and dynamic.

angularjs tutorial about Creating an Ionic App

Creating an Ionic App

1:18 angularjs PRO

In this lesson, we create our first Ionic app. We use a pre-defined Ionic template to give us some views and data straight out of the gates. This allows us to have a web app up and running in our browser, ready for us to explore, in four simple command prompt commands.

angularjs tutorial about Install Ant for Ionic

Install Ant for Ionic

1:39 angularjs PRO

In this lesson, we install Apache Ant and create an environment variable for it. Ant is a tool used primarily to build Java applications and is also necessary to run Android. Ionic uses Ant to aid in driving the processes that will build the native Android app later on.

angularjs tutorial about Ionic Quickstart for Windows: Installing Ionic

Ionic Quickstart for Windows: Installing Ionic

0:40 angularjs PRO

In this lesson, we install Ionic. With just a couple command prompt commands, we gain access to the powerful Ionic command-line utility, which in turn installs Apache Cordova to aid in connecting our web apps to our mobile device’s native functionality. After this lesson, we will be able to create and run and app.

angularjs tutorial about Install Android SDK for Ionic

Install Android SDK for Ionic

4:58 angularjs PRO

In this lesson, we install the Android Software Development Kit (SDK) and the necessary Android API (Application Interface). This is the code base that allows us to run the Android platform on our PC. We also add a couple environment variables and update our PATH environment variable.

angularjs tutorial about Install the Genymotion Android Emulator for Ionic

Install the Genymotion Android Emulator for Ionic

2:08 angularjs PRO

In this lesson, we install Genymotion, which allows us to create virtual Android devices on our PC. We could use the Android emulators provided by the Android SDK, but on Windows this proves to be problematic. Most Android developers that operate on a PC opt for using Genymotion, not only because it’s faster, but because it provides easy access to testing different native functions of Android devices, such as the camera, microphone, accelerometer, etc.

angularjs tutorial about Install the Java Developer Kit (JDK) for Ionic

Install the Java Developer Kit (JDK) for Ionic

2:27 angularjs PRO

In this lesson, we install the Java Developer Kit (JDK). The JDK contains the Java Runtime Environment (JRE) and all the tools necessary to compile Java applications. This is necessary to compile and run Java, which in turn is necessary to run android.

angularjs tutorial about Run Your First Ionic App

Run Your First Ionic App

2:06 angularjs PRO

In this lesson, we learn how to run an app on our PC using Genymotion. Genymotion provides a simple UI that enables us to create and run virtual devices with a couple clicks. Once our virtual device is running, it is just a matter of a couple commands in the command prompt and we can view and test our app on our PC.

angularjs tutorial about Edit Your Ionic Application Code

Edit Your Ionic Application Code

1:45 angularjs PRO

In this lesson, we quickly demonstrate how to edit our code and re-run our app. The pertinent piece of the puzzle is knowing where the code for the HTML/Javascript/CSS is. Once we know where that is, editing it and running the app is a cinch!

angularjs tutorial about Deploy Your Ionic App to a Device

Deploy Your Ionic App to a Device

3:15 angularjs PRO

This lesson has two parts: 1) uploading our app to an Ionic account and 2), downloading the Ionic View app to your phone. Once this lesson is done, we will be able to view our app in our Ionic account dashboard and manage settings for it. We will also be able to share our app with anyone who downloads the Ionic View app, so they don’t have to build and run our app themselves.

angularjs tutorial about Angular with Webpack - Uglifying your JavaScript

Angular with Webpack - Uglifying your JavaScript

4:42 angularjs PRO

Angular requires some careful consideration when uglifying your code because of how angular's dependency injection system works. See how easy it is to add this consideration to your webpack configuration so you can minify your Angular JavaScript with Webpack.

angularjs tutorial about Angular Automation: Gulp Serve

Angular Automation: Gulp Serve

2:49 angularjs PRO

In this lesson, we are going to learn how to automatically serve our project via an HTTP server using gulp-serve. Being able to serve our project from an HTTP server allows us to bypass a myriad of development issues such as loading remote source files.

angular2 tutorial about Say "Hello World" to Angular 2

Say "Hello World" to Angular 2

1:10 angular2

The quickest way to get started with Angular 2 is to use the Angular CLI. The Angular CLI allows you to create new projects and startup a server in just a couple quick commands. This lesson shows how to install the cli, start the server, and make a simple change.

angular2 tutorial about Create a Simple Angular 2 Component

Create a Simple Angular 2 Component

2:10 angular2

The simplest way to create a new component is again to use the Angular CLI. The Angular CLI can quickly generate components for you to use inside your modules and your templates. This lesson walks through using the Angular CLI to generate an Angular 2 Component then using that Component in your application.

angular2 tutorial about Manage Angular 2 Elements with Events and Refs

Manage Angular 2 Elements with Events and Refs

2:00 angular2

Angular 2 provides powerful template syntax to access events and elements inside of your Component's class. This lesson shows how to access the click events off of a button and the values and element off of an input.

angular2 tutorial about Control Angular 2 Events with $event and Event Handlers

Control Angular 2 Events with $event and Event Handlers

1:01 angular2

This lesson talks about the benefits of using the parens-based (click) syntax so that Angular 2 can handle any custom event. Then the video explains how to pass in the actually event object using the familiar $event syntax.

angular2 tutorial about Share Services and Data with Angular 2 Dependency Injection

Share Services and Data with Angular 2 Dependency Injection

1:22 angular2

The Angular CLI generates Services using a simple command. After your Service is generated, you can easily provide and share it to the rest of your application using Angular 2's Dependency Injection. This lesson walks through creating a Service with the Angular CLI then providing it to your application module.

angular2 tutorial about Provide and Share Values with Angular 2 Dependency Injection

Provide and Share Values with Angular 2 Dependency Injection

1:50 angular2

TypeScript is used heavily as we build up our application, but TypeScript isn’t required. If you want to Inject a Service without using TypeScript, you’ll need to understand the @Inject decorator. The @Inject decorator also allows you to provide any value or object that you need to share throughout your application without having to create a service.

angular2 tutorial about Loop Through Angular 2 Components with ngFor

Loop Through Angular 2 Components with ngFor

1:58 angular2

This lesson covers Angular 2’s version of looping through data in your templates: *ngFor. It’s conceptually the same as Angular 1’s ng-repeat, but you’ll find the syntax quite different as it aligns with #refs in Angular 2 and JavaScript “for of” loop.

angular2 tutorial about Sync Values from Inputs with Angular 2’s ngModel Two-Way Binding

Sync Values from Inputs with Angular 2’s ngModel Two-Way Binding

1:43 angular2

Two-way binding still exists in Angular 2 and ngModel makes it simple. The syntax is a combination of the [input] and (output) syntax to represent that the data is being pushed out and pulled in.

angular2 tutorial about Adding a data model

Adding a data model

2:19 angular2 PRO

This video covers migrating from simple strings to more complex objects inside of our Service to enable more features later on.

angular2 tutorial about Template property syntax

Template property syntax

1:39 angular2 PRO

This lesson covers using the [input] syntax to change an element property such as “hidden” or “content-editable”. Using properties eliminates the need for Angular 1’s old directives such as ng-show and ng-hide as you’re now able to directly access any property on your element.

angular2 tutorial about Pass Values into Angular 2 Components with @Input

Pass Values into Angular 2 Components with @Input

1:59 angular2

@Input allows you to pass data into your controller and templates through html and defining custom properties. This allows you to easily reuse components and have them display different values for each instance of the renderer.

angular2 tutorial about Write CSS Inside of Angular 2 Components

Write CSS Inside of Angular 2 Components

2:57 angular2

Many Components require different styles based on a set of conditions. Angular 2 helps you style your Components by allows you to define CSS and styles inline, then choosing which styles to use based on the current values in your Controller.

angular2 tutorial about Use Global CSS Inside Angular 2 Components

Use Global CSS Inside Angular 2 Components

1:46 angular2

Global CSS and stylesheets are also available to Angular 2 Components even though the styles you define inline will remain isolated to the Component itself. You can customize this behavior using ViewEncapsulation if you need to keep global styles out of your Components.

angular2 tutorial about Using Pipes to Filter Data

Using Pipes to Filter Data

2:24 angular2 PRO

Pipes allow you to change data inside of templates without having to worry about changing it in the Controller. Creating a custom Pipe is as simple as giving it a name and a transform function that output what you expect.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?