AngularJS

Watch User Created Playlist (36)

This playlist is user created.

pro-course-rss-logo

PRO RSS Feed

Directives Talking to Controllers

Directive for Route Handling

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

resolve $routeChangeError

Resolve

resolve conventions

$routeParams

Basic Promises in AngularJS

$routeProvider api

The config function

ng-view

$templateCache

templateUrl

$scope vs. scope

angular.element

Transclusion Basics

Isolate Scope Review

P

Isolate Scope "&"

Isolate Scope "="

Isolate Scope "@"

Understanding Isolate Scope

Directive to Directive Communication in AngularJS

Useful Behaviors

Basic Behaviors

Build and Run an iOS App on a Mac

P

Directive Restrictions

First Directive

Sharing Data Between Controllers

Services, Factories, and Providers: Creating a Factory

Services, Factories, and Providers: Creating a Service

Basic Binding in AngularJS

Controllers

P

Angular Automation: Gulp Config

P

Angular Automation: Gulp Watch

P

Angular Automation: Gulp Serve

Sync Requests with RxJS and Angular

P

Directives Talking to Controllers

4:43 angularjs

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 for Route Handling

3:02 angularjs

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

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

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

4:48 angularjs

$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.

resolve $routeChangeError

5:09 angularjs

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

angularjs tutorial about Resolve

Resolve

2:05 angularjs

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

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.

$routeParams

2:14 angularjs

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

Basic Promises in AngularJS

4:03 angularjs

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 $routeProvider api

$routeProvider api

1:50 angularjs

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.

angularjs tutorial about The config function

The config function

2:55 angularjs

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.

ng-view

3:03 angularjs

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.

$templateCache

3:07 angularjs

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

templateUrl

3:45 angularjs

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.

$scope vs. scope

9:14 angularjs

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.

angularjs tutorial about angular.element

angular.element

8:40 angularjs

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

angularjs tutorial about Transclusion Basics

Transclusion Basics

2:48 angularjs

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...

Isolate Scope Review

3:30 angularjs PRO

A review of the three types of isolate scope binding methods in AngularJS. The "@" operator is used for reading an attribute, "=" is used for creating a bi-directional two way binding, and "&" is used to make a call on something a controller scope.

angularjs tutorial about Isolate Scope "&"

Isolate Scope "&"

6:03 angularjs

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

Isolate Scope "="

2:51 angularjs

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

Isolate Scope "@"

4:51 angularjs

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.

angularjs tutorial about Understanding Isolate Scope

Understanding Isolate Scope

6:38 angularjs

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.

Directive to Directive Communication in AngularJS

8:01 angularjs

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.

Useful Behaviors

2:55 angularjs

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.

angularjs tutorial about Basic Behaviors

Basic Behaviors

3:29 angularjs

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).

angularjs tutorial about Build and Run an iOS App on a Mac

Build and Run an iOS App on a Mac

3:49 angularjs PRO

In this lesson, we learn how to run an app on our Mac. We are going to download Xcode, which includes an iOS simulator. Once we have Xcode, it is a matter of a couple commands in our terminal to run and view our app on our mac.

angularjs tutorial about Directive Restrictions

Directive Restrictions

3:01 angularjs

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 First Directive

First Directive

2:08 angularjs

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 Sharing Data Between Controllers

Sharing Data Between Controllers

5:13 angularjs

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 Services, Factories, and Providers: Creating a Factory

Services, Factories, and Providers: Creating a Factory

3:53 angularjs

Creating your own services in AngularJS can be confusing. What are the differences between an AngularJS module's Service, Provider and Factory functions? This lesson shows how Angular's factory function is just the JavaScript module design pattern.

angularjs tutorial about Services, Factories, and Providers: Creating a Service

Services, Factories, and Providers: Creating a Service

3:45 angularjs

Creating your own services in AngularJS can be confusing. What are the differences between an AngularJS module's Service, Provider and Factory functions? This lesson shows how Angular's service function is just a constructor function.

angularjs tutorial about Basic Binding in AngularJS

Basic Binding in AngularJS

1:27 angularjs

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.

Controllers

1:11 angularjs PRO

Controllers are the 'glue' of an AngularJS application. They connect your markup with your data and act as a sort of switchboard.

angularjs tutorial about Angular Automation: Gulp Config

Angular Automation: Gulp Config

3:35 angularjs PRO

In this lesson, we are going to learn how to create a config file to store common values so that we can reuse them multiple times in our gulpfile.js. As our gulpfile.js grows in complexity, we may find that we are introducing complex and multiple file path references. By creating a gulp.config.js file, we can simplify these references and make it easier to refactor and extend in the future.

angularjs tutorial about Angular Automation: Gulp Watch

Angular Automation: Gulp Watch

5:02 angularjs PRO

In this lesson, we are going to learn how to use gulp.watch to detect local file changes and execute additional Gulp tasks. To illustrate this concept, we are also going to hook up gulp-jshint to automation lint our JavaScript as we make changes to our code.

angularjs tutorial about Angular Automation: Gulp Serve

Angular Automation: Gulp Serve

2:49 angularjs

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.

angularjs tutorial about Sync Requests with RxJS and Angular

Sync Requests with RxJS and Angular

4:56 angularjs PRO

When you implement a search bar, the user can make several different queries in a row. With a Promise based implementation, the displayed result would be what the longest promise returns. Here we see how RxJs can be used to avoid this problem.

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