title: IE : Angular Controller As losing scope when there is error in other JavaScript library
body: <p>I am using the ControllerAs syntax in AngularJs. The issue I am facing is that there is an error being thrown by the jQuery library when other javascript library calls the jQuery which is run parallel and this causes my ControllerAs to stop working.
  Please find my code below</p>
  
  <p>The code runs correctly in Chrome <strong>but not in IE</strong>.</p>
  
  <p>The error thrown by IE is </p>
  
  <blockquote>
    <p>SCRIPT5022: InvalidCharacterError</p>
  </blockquote>
  
  <p>The error thrown by chrome is </p>
  
  <blockquote>
    <p>Uncaught DOMException: Failed to execute 'setAttribute' on 'Element':
    'aria-expanded ' is not a valid attribute name</p>
  </blockquote>
  
  <p>I know the issue is to remove the extra whitespace in aria-expanded, but I do not have the privilege to change that javascript library.</p>
  
  <pre><code>var stApp = angular.module("AngularApp",["ngRoute","ngSanitize","ui.bootstrap"]);
      stApp.config(function($routeProvider) {
          $routeProvider
          .when("/", {
              templateUrl : "https://somedomain.com/sites/somesite/Assets/js/Application/sessions.html", controller:"appcontroller"
          })
          .when("/create", {
              templateUrl : "https://somedomain.com/sites/somesite/Assets/js/Application/createnew.html", controller:"appcontroller"
          })
          .when("/editimage/id/:spot_event_id", {
              templateUrl : "https://somedomain.com/sites/somesite/Assets/js/Application/editimage.html", controller:"appcontroller", controllerAs: 'stc'
          }) 
          .otherwise({ redirectTo: '/' })   
      });
  
      stApp.controller('appcontroller', appcontroller);
  
      function appcontroller($scope,$routeParams,$window,$timeout,$location,$uibModal,fileReader,SessionInfo){
  
  
          var modal = this;
          vm.ShowLoading = true;
          /** Other Variables required are declared below which cannot be shown**/
  
          SessionInfo.GetEventsInfoAsync($scope); // This functions performs a async call and the function utilizes $broadcast to trigger $scope.$on('asyncEventInfoResult')
  
  
          $scope.$on('asyncEventInfoResult', function (event, data) {         
              $scope.$apply(function () {         
                  data.Events.forEach(function(item,index){
                      var organizers = [];
                      item.Organizer.forEach(function(user,index){
                          organizers.push(user.get_lookupValue());
                      });
                      item.Organizers = organizers;
                      var sessionTime = new Date(item.StartTime);
                      var today = new Date();
                      if(sessionTime&gt;today)
                      {
                          vm.Events.UpcomingEvents.push(item);
                      }           
                      else
                      {
                          vm.Events.PastEvents.push(item);
                      }
                  });
                  vm.ShowLoading = false;                     
              });
          });
      }
  </code></pre>