Angular, Cordova, JavaScript, Visual Studio

Debugging AngularJS in Visual Studio 2015

While working on the Cordova Drum Machine I’m currently streaming live at LiveCoding.tv/sorskoot, I ran into a few issues with Visual Studio debugger. Normally I debug my ‘normal’ AngularJS web applications inside Chrome using an extension on the debug tools that shows the context of the selected HTML element. In Visual Studio I do not have these tools available. Here’s how to get information on the Angular context of a selected element. Scope The first thing that’s really useful to gain insight to is the Angular scope. The scope has to be read from a specific DOM element. To select…

Angular, Cordova, Windows 10

Fix unsafe:ms-appx-web issues in Angular and Cordova on Windows 10

During a recent stream over at LiveCoding.TV I ran into some issues with displaying an image in a Cordova app I’m building. This image was stored inside my appx package, but the Content Security Policy blocked it anyways. It turned out I needed to whitelist the ms-appx and ms-appx-web protocols. I modified the initialization of the Angular module to whitelist these protocols for images and hrefs as you can see in the example below: angular.module(‘app’, [‘ngRoute’], function ($compileProvider) { $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|file|chrome-extension|ms-appx-web|ms-appx):|data:image\//); $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|chrome-extension|ms-appx-web|ms-appx):/); });

Angular, Windows Store apps, WinJs

Angular in a Windows Store app – Servicing

Today I’m adding an AngularJS service to the Windows Store project in Visual Studio. This service is making a call to an external webservice which returns some JSON data. This controller uses a promise to handle the call to the service and when it’s fulfilled the data is shown on the screen. You can find the code: https://github.com/sorskoot/AngularWinjsDemo

Angular, Windows Store apps

Angular in a Windows Store app – Taking Control

Hi everyone! Just uploaded a new video on working with AngularJS in a Windows Store app. In this episode I show you how to bootstrap Angular, add a very simple controller and bind it to the view. Follow the whole series on http://youtube.com/c/winjsninja

Angular, Windows Store apps

Angular in a Windows Store app

I was trying to use Angular JS in a Windows store app and had some issues with Angular being “unsafe”. Using Angular JS in a JavaScript Windows Store app turned out to be pretty easy. Here’s how to do it: First create a new app. Install Angular JS though NuGet. Add a scripts tag to your default.html. <script src=”Scripts/angular.js”></script> Running the app at this point will result in the following error: The trick to get around this error is to enable CSP (Content Security Policy) and the most convenient part is that Angular has a directive to set that. All…