As of late, I’ve really been getting more and more into Angular. For me, the important aspects are learning how to do what I’ve done with v1.x in the newer framework. This involves a great deal of understanding of the difference between v1.x and v2.x. Since one of my most popular Angular 1.x directives is the Multiselect Dropdown w/ Checkboxes, I decided to tackle converting it in incremental steps. From the top, the first piece of significant functionality is filtering the list of items.
EDIT: Be sure to check out my newer article on Angular Pipes.
In my previous post, I put together a little demo showing how to detect if capslock is depressed and how to warn the user. To make this a bit more useful and reusable, I rolled it into an Angular 1.x directive.
Letting a user know that CapsLock is set can be a UI nicety. I needed this feature earlier today so I put together a demo.
Angular provides some handy mechanisms for dealing with browser history. With these mechanisms it’s straight-forward to handle URL changes through direct user interaction or the browser back/forward buttons.
Typically, when entering an Angular app, you’ll have an abstract route defined and then use the $urlRouterProvider to define a default route. Well, when I say “you,” I should qualify that to say that this is how I typically define states with ui-router.
Unless you don’t keep up with Angular development at all, you heard that Angular2 final was released last week. Yesterday, I had an opportunity to update my simple Visual Studio 2015 Basic Routing demo from RC4 to Final. There were breaking changes that had to be resolved.
Using the .NET Core Middleware for request processing is, imho, not very well documented. There are a couple of things that are not obvious: retrieving query parameters and binding a request body to an object. To top things off, accessing the request Body has a few issues. Here’s how to deal with these scenarios.
ASP.NET’s built in CSRF (Cross-site request forgery) is pretty straight forward. You add a token to your views via an HTML Helper, and then decorate your controller actions with a specific attribute to validate the token on POST. There are many times, seemingly randomly, where users have invalid tokens on their requests. MVC throws a 500 error with an HttpAntiForgeryException. For legitimate users, this is not an optimal experience.
A while back, I blogged about a pattern of accessing API’s with .NET’s HttpClient. In practice, one problem with .NET’s HttpClient is that it doesn’t provide any insight regarding Http redirects.
Earlier, I wanted to play around with Angular CLI, but my npm and node versions were out of date. The Angular CLI npm install would fail.
Fortunately, there is a straight-forward update method.
On github, the Microsoft team has placed a method for updating node through PowerShell:
I was happy to stumble upon this on Github. After using the script in the recommended fashion, from an elevated PowerShell console, the Angular CLI npm installer worked without a hitch.
Set-ExecutionPolicy Unrestricted -Scope CurrentUser -Force
npm install --global --production npm-windows-upgrade
Since writing my previous blog post on an Angular reusable table directive, this directive has been updated quite a bit.
The github source and demos reflect the latest code, but I want to detail some of the major changes.