The Perfect AngularJS 1.3 migration guide from Perfomatix. Start reading this post from the best angularjs development company named Perfomatix that depicts the angularjs 1.3 migration.
Angular

How to do the AngularJS 1.3 migration? Top things to remember

AngularJS 1.3 comes with many features and improvements which are not found in AngularJS 1.2. Now 1.3 is mainly focused on:

  • Performance – With many operations like DOM manipulation and digest 3 – 4x faster, you automatically get snappier apps.
  • Forms – Simpler and more capable APIs let you write less code and better match user expectations when validating forms.
On what’s changed
  • IE8 is no longer supported
    With the release of angularJS 1.3, they have removed support for IE8. This gives the angular js developers to perform modern browser implementations.
  • Input types date, time, datetime-local, month, week now always require a Date object as a model.
  • $https: added XHR (XML HttpRequest) statusText to completeRequest callback
    Previously there was no way to get XHR statusText in $http error callback, it only returned status(number – statusCode). With 1.3 they have added status text to display the server error message in the browser eg.,
  • 404 – Resource not found
  • 400 – User ID already exists
  • $Scope: add $watchGroup method for observing a set of expressions$watchGroup allows to watch an array of variables     
  • ngModelOptions: custom triggers and debounce of ngModel updates – It delays the binding to a view with time/any javascript events.
  • Introduced the NgMessages module and directives. With NgMessages, directive form validation will be a piece of cake. i.e., catching the corresponding error and showing their respective error messages are made easy with NgMessages
  • lazy one-time binding support – By Simply prefixing an expression with ::, tells angular to stop watching after the expression was first evaluated.

Migrating from AngularJS 1.2 to AngularJS 1.3
  • .bind, .call or .apply on a function in angular expressions are no longer supported. You can no longer invoke .bind, .call or .apply on a function in angular expressions. This is to disallow changing the behaviour of existing functions in an unforeseen fashion.
  • The (deprecated) proto property does not work inside angular expressions anymore. This prevents the use of {define,lookup}{Getter,Setter} inside angular expressions. If you really need them for some reason, please wrap/bind them to make them less dangerous, then make them available through the scope object.
  • Angular.copy – This changes angular.copy so that it applies the prototype of the original object to the copied object. Previously, angular.copy would copy properties of the original object’s prototype chain directly onto the copied object.This means that if you iterate over only the copied object’s hasOwnProperty properties, it will no longer contain the properties from the prototype. This is actually much more reasonable behaviour and it is unlikely that applications are actually relying on this. If this behaviour is relied upon, in an app, then one should simply iterate over all the properties of the object (and its inherited properties) and not filter them with hasOwnProperty.
  • Promise unwrapping has been removed – $parseUnwraps promises returned by functions invoked by $parse. It has been deprecated since 1.2.0-rc.3. It can no longer be turned on. Two methods have been removed:$parseProvider.unwrapPromises
    $parseProvider.logPromiseWarnings
  • The JSONP behavior for erroneous and empty responses changed. Previously, a JSONP response was regarded as erroneous if it was empty. Now Angular is listening to the correct events to detect errors, i.e. even empty responses can be successful.
  • Values ‘f’, ‘0’, ‘false’, ‘no’, ‘n’, ‘[]’ are no longer treated as falsyOnly JavaScript falsy values are now treated as falsy, there are six of them: false, null, undefined, NaN, 0 and “”. Since the angular toBoolean function has been removed.
  • NgModelIf an expression is used on ng-pattern (such as ng-pattern=”exp”) or on the pattern attribute (something like on pattern=”{{ exp }}”) and the expression itself evaluates to a string then the validator will not parse the string as a literal regular expression object (a value like /abc/i). Instead, the entire string will be created as the regular expression to test against. This means that any expression flags will not be placed on the RegExp object. To get around this limitation, use a regular expression object as the value for the expression.
  • forEachforEach will iterate only over the initial number of items in the array. So if items are added to the array during the iteration, these won’t be iterated over during the initial forEach call.
  • $broadcast and $emit
    $broadcast and $emit will now reset the currentScope property of the event to null once the event finished propagating. If any code depends on asynchronously accessing their currentScope property, it should be migrated to use targetScope instead.
  • $http interceptor intercepts every outgoing/ incoming HTTP requests, this HTTP interceptor is normally used to filter the URL for a particular pattern or it can be used to notify the user of an ongoing HTTP request.
    // register the interceptor as a service
    $provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
      return {
        // optional method
        'request': function(config) {
          // do something on success
          return config;
        },
    
        // optional method
        'response': function(response) {
          // do something on success
          return response;
        }
      };
    });
    
    $httpProvider.interceptors.push('myHttpInterceptor');
    // alternatively, register the interceptor via an anonymous factory
    $httpProvider.interceptors.push(function($q, dependency1, dependency2) {
      return {
       'request': function(config) {
           // same as above
        },
    
        'response': function(response) {
           // same as above
        }
      };
    });

 

Perfomatix | Product Engineering Services Company