Posts

Showing posts with the label angularjs

Adding Google Maps to Your AngularJS Application

Image
Hi, in this post I will show how to add Google maps to your Angular application. At the end of this post, we will be able to see the map of the United States and we will be able to pan and zoom.

AngularJS AJAX GET and POST Example with ASP.NET MVC JsonResult

Image
A while back I blogged about Using JQuery AJAX GET with ASP.NET MVC JsonResult . This time, we will be talking about using AngularJS for making GET and POST methods using the $http service.

End-to-End Image Upload with Azure Storage, AngularJS, and Web API

Image
A common feature in web applications is image upload. Images can be stored on disk, in the database, or in some other server. In this post we will take the third approach and store images using Azure Storage. We will also be using AngularJS on the front-end and Web API in the back-end.

Using AntiForgeryTokens in ASP.NET MVC with AngularJS

Image
Protection against CSRF (use of AntiForgery tokens) is supported in both the ASP.NET MVC and AngularJS frameworks. However, they have different implementations. What this means is that the default implementation of ASP.NET MVC for AntiForgery tokens will not work out-of-the box on an AngularJS front-end. In this post we will look at this in more detail and come up with a solution to the problem.

AngularJS and SEO

Image
There is no doubt that JavaScript MVC / MVVM frameworks such as AngularJS provide better experiences for both developers and users alike. However, there are some caveats that we should be aware of when using this framework. Specifically, search engines might not be able to read the content in our applications if we are using the data binding features provided by these frameworks. In this post I will compare two scenarios: one using server-side data binding and one using client-side data binding and talk about their SEO implications.

Login with AngularJS and ASP.NET Web API

Image
When creating a non-Web API ASP.NET MVC project using Individual Accounts, the generated template makes use of Forms Authentication. When logging in using Forms Authentication, a cookie is stored on the client's machine and that cookie is included by the browser in each future request.

Common AngularJS Directives for Designers

Image
AngularJS is not only for UI developers, but also for UI designers. In fact, the separation of concerns and readability that AngularJS brings enable smooth collaboration between designers and developers. Here are some common directives that designers will encounter in AngularJS.

AngularJS and Strongly Typed Views

Image
AngularJS is a powerful templating MVC Javascript framework developed by Google. In this post, we will be talking about how to use AngularJS with ASP.NET MVC, particularly with strongly-typed views.

Scope Inheritance in AngularJS

Image
Scopes in AngularJS use prototypical inheritance. When a child scope tries to access a variable, it first looks for that variable in its own scope. If it doesn't find any, it looks for it in the parent scope, and so on until the $rootScope is reached. This post will illustrate this concept of inheritance in AngularJS.

AngularJS: Using ng-repeat

Image
AngularJS is the Javascript MVC framework developed by Google. In this post we will build a simple application using AngularJS. If you aren't familiar with it, you might want to read my introduction to AngularJS first. This post will introduce the concept of controllers and the app will display a simple list of items (persons) to the view. In this application I will be using AngularJS 1.0.6 which is the latest stable version as of this writing. For the CSS, I am using Twitter bootstrap. Setting up the Files First off, here's the barebones html file as well as what it looks like when run:

Introduction to AngularJS

Image
If you've been reading about javascript frameworks then you're probably seen AngularJS. AngularJS is a javascript framework developed by Google. It supports a MVC pattern and handles two-way data binding between the model and the view. Aside from two-way data binding, it also has support for declaring new html syntax, validation, routing, and more. In this post we will talk about the data binding capability. Setting Up the Site First off, we need to have a reference to the AngularJS file, which you can download from here . In this example I downloaded the Uncompressed build of the Stable branch (1.0.6).