Shows route resolving with fallback mechanism on rejection

<!DOCTYPE html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script>
    <script src="script.js"></script>
  </head>

  <body ng-app="simple" ng-controller="simpleController as ctrl">
    <s-blubb ng-model="ctrl.myValue"></s-blubb><br />
    <s-bla ng-model="ctrl.myValue"></s-bla>
    <p>Simple output: {{ctrl.myValue}}</p>
  </body>
</html>

angular.module("simple", []);

angular.module("simple")
  .directive("sBla", function() {
    return {
      template: "xyz: {{myval}}",
      scope: {
        myval: "=ngModel"
      },
      restrict: "E"
    }
  });
angular.module("simple")
  .directive("sBlubb", function() {
    return {
      template: "<s-bla ng-model='innerValue'></s-bla>",
      scope: {
        innerValue: "="
      },
      restrict: "E",
      require: 'ngModel',
      link: function(scope, element, attrs, ngModelCtrl) {
        var listener = scope.$watch(function(){
            return ngModelCtrl.$viewValue;
          }, function(value){
            scope.innerValue = value + 15;
            listener();
        });
        
        element.bind("click", function () {
          scope.innerValue += 5;
          ngModelCtrl.$setViewValue(scope.innerValue);
        });
      }
    }
  });

angular.module("simple")
  .controller("simpleController", function() {
    this.myValue = 20;
  });