AngularStrap - AngularJS 1.2+ native directives for Twitter Bootstrap 3. AngularJS SEO with Prerender.io. AngularJS is an excellent framework for building websites and apps.
Built in routing, data-binding and directives among other features enable AngularJS to completely handle the front-end of any type of application. The one pitfall to using AngularJS (for now) is Search Engine Optimization (SEO). In this tutorial, we will go over how to make your AngularJS website or application crawlable by Google. The Problem Search engines crawlers (or bots) were originally designed to crawl HTML content of web pages. If you are fully utilizing AngularJS, there is a strong possibility that you will only have one real HTML page that will be fed HTML partial views asynchronously.
The Solution Rest assured, Google does have a way of indexing AJAX applications and your AngularJS app can be crawled, indexed and will appear in search results just like any other website. What We’ll Be Building Our application will be able to be rendered by Google bot and all his friends (Bing bot). How It Works About Prerender.io. Codebrag. Written byMichał Ostruszka As AngularJS is one of the tools in Codebrag's toolbox, you can expect some technical posts related to our development process with it.
Let’s start with the first one below. You know the case when you hit submit button quickly enough that it sends the form twice? Or when you hit submit button and it seems that nothing happens, so you click it once again and another request is being fired? Duplicated requests issue - you can experience it in both traditional web application as well as in modern so-called Single Page Applications. AngularJS itself has no built-in stuff for that. Disable button after submit Suppose you want to prevent user to double-submit the same form. Asynchronous UI approach. Service or factory ? Tl;dr is at the end In various AngularJS tutorials and documentation, the authors choose to use service or factory but don't explain why you would use one or the other.
Few mention that value and constant are also options. Let's see why you would use one over the other. We should also understand how providers work: provider Here's the source for the provider method: function provider(name, provider_) { if (isFunction(provider_) || isArray(provider_)) { provider_ = providerInjector.instantiate(provider_); } if (! Name is a string. provider_ can be one of three things: function If a function is passed in, the function is called with dependency injection and should return an object with a $get method. Whatever the second arg to provider is, you eventually end up with an object that has a $get method. // You can run this // Create a modulevar hippo = angular.module('hippo', []); // Get the injector (this happens behind the scenes in angular apps)var injector = angular.injector(['hippo', 'ng']);
Deal with users authentication. This post is meant to share some thought about the main issues related to the user’s authentication in an AngularJS web app.
This post is about how to maintain, and recognize, the status of authentication of an user (that is, if he’s logged in, or not) between the different routes of a web application. Moreover it also explains how to handle the case of a not authenticated user, who is trying to access to a page, that requires the user to be logged in. Before going into the details of my approach, it is very important to clarify that, because the user has full controll of the browser, each control implemented with front end technologies, must (!)
Be repeated also in the backend. Recognize an authenticated user. Q:Inject a model object in controllers. Switch view from controller. Services. Improve this doc While Angular offers several useful services, for any nontrivial application you'll find it useful to write your own custom services.
To do this you begin by registering a service factory function with a module either via the Module#factory api or directly via the $provide api inside of module config function. All Angular services participate in dependency injection (DI) by registering themselves with Angular's DI system (injector) under a name (id) as well as by declaring dependencies which need to be provided for the factory function of the registered service. The ability to swap dependencies for mocks/stubs/dummies in tests allows for services to be highly testable. To register a service, you must have a module that this service will be part of. Using the angular.Module api: Using the $provide service: Note that you are not registering a service instance, but rather a factory function that will create this instance when called.
How to use $broadcast and $rootScope. When to use $scope.$apply. If you’ve written a non-trivial amount of code in AngularJS, you may have come across the $scope.
$apply() method. On the surface, it may seem like just a method you call to get your bindings to update. But why does it exist?