Rick Strahl's Web Log

Wind, waves, code and everything in between...
ASP.NET • C# • HTML5 • JavaScript • AngularJs
Contact   •   Articles   •   Products   •   Support   •   Search
Ad-free experience sponsored by:
ASPOSE - the market leader of .NET and Java APIs for file formats – natively work with DOCX, XLSX, PPT, PDF, images and more

WebLog Posts in Category Angular


Error Handling and ExceptionFilter Dependency Injection for ASP.NET Core APIs



Exception handling in API applications is important as errors - both handled and unhandled - need to be passed to clients in some way to let them display error information. ASP.NET's default error handling doesn't provide for object error results by default, but you can use an ExceptionFilter to intercept exceptions and format them yourself. In this post I look at how to create an API exception filter to create error object responses, and hook up custom logging of those errors to disk.

Bootstrap Modal Dialog showing under Modal Background



On more than a few occasions I've run into issues with Bootstrap's Modal dialog rendering incorrectly with the dialog showing underneath the overlay. There are a number of ways around this problem, but none of them are universal that depend on how your pages are laid out. It's especially problematic for applications that dynamically render components where there's no good control on where the elements are placed outside of the components DOM containership. In this post, I describe a few of the workarounds and their limitations.

External JavaScript dependencies in Typescript and Angular 2



Angular 2.0 and Typescript make it very easy to import external Typescript classes and references using the module loading functionality built into Typescript (and ES6). However, if you need to work with external libraries that aren't built with Typescript you need to do a little extra work in importing and referencing the external libraries. In this post I show two approaches for importing libraries as modules and dereferencing library globals so that the Typescript compiler is happy.

The Rise of JavaScript Frameworks – Part 2: Tomorrow



JavaScript frameworks are undergoing a huge change for their V2 releases, going through the growing pains of providing a more modern platform and bridging new technologies. While the new frameworks promise improved performance and usability, there is also quite a bit of pain involved in respect to the build process and making the move to ES6.

The Rise of JavaScript Frameworks - Part 1: Today



JavaScript frameworks have moved front and center in the mainstream in the last year and a half or so. When building modern Web applications, the bar has been raised significantly by what is possible in large part due to the more accessible mainstream frameworks that are available today to build rich client and mobile Web applications. In this post I'll explore why JavaScript frameworks have become so popular so quickly and how it effects the future of Web development. This two part series addresses the current state in this post, and the new crop of V2 frameworks arriving later this year in the Part 2.

Right To Left (RTL) Text Display in Angular and ASP.NET



Recently I was gently asked to add support for RTL language editing in my Westwind.Globalization library and the Web Resource Editor. The Editor supports displaying resources in all of its localized version, but it didn't respect the RTL setting for languages that required it. In this post I describe how RTL support works in browsers, how you can detect RTL support on a locale in .NET and demonstrate how I integrated basic RTL edit and display support for the Resource Editor using a custom Angular directive.

Angular Select List Value not binding with Static Values



Ran into a problem converting from Angular 1.3 to 1.4rc a couple of days ago. The issue is that the way ng-model bindings work has changed, in that Angular 1.4 and later uses exact type matching for value comparisons which results in behavior changes. In my case I ran into a problem with static list values binding to a non-string value which caused the binding to effectively not work at all. Here's what the problem is and how to work around it.

Mixing $http Promises and $q Promises for cached Data



When creating services it's often useful to return data from the $http service, or cached data that already exists. You can't however just return the cached data, but have to turn it into a promise so it matches the $http callback signature. Here's how to deal with this frequent scenario.

AngularJs and Promises with the $http Service



The AngularJs $http object returns custom promises which can be surprising when you try to work with them. You can use either .then() or the easier .success() and .error() methods - at the cost of some inconsistency in Promise usage as these extension are specific to the $http functions. In this post I review a few different ways you can use promises and more importantly what the various $http methods return.

AngularJs ng-cloak Problems on large Pages



Angular supports the ng-cloak directive to address hiding initially unrendered template content. I found out the hard way that sometimes with very large pages this mechanism doesn't quite work and still results in slight page flicker of the unrendered template content. In this post I describe the problem and several easy solutions to get around it the edge case scenario.

Routing to a Controller with no View in Angular



Angular provides a nice routing, and controller to view model that makes it easy to create sophisticated JavaScript views fairly easily. But Angular's views are destroyed and re-rendered each time they are activated - what if you need to work with a persisted view that's too expensive to re-render? Here's how to build a headless controller that doesn't render a view through Angular, but rather manages the the view or markup manually.

JavaScript Arrays, References and Databinding in Angular



Ran into a snag with Angular Databinding where items added to an array $scope variable were not 'overwriting' other array elements. Turns out this isn't an Angular issue, but a JavaScript referencing issue, that can be easy to miss when using data binging.