Joetjah Joetjah - 5 months ago 36
AngularJS Question

Override a function from ui-bootsrap

I've included the angular-bootstrap library in my application using bower.

I'm currently using a (old) version containing a bug which is solved in a newer version. However, in my situation an upgrade is not yet possible.

I also thought of adding a custom modified js file below the importlines of bower in my

index.html
page, but compile errors occur.

I know exactly the right LOC containing the bug in the .js of the library
ui-bootstrap.js
, but these changes wouldn't be appropriate in that file because I develop in automated building system that would just overwrite my changes.

Therefore, I'd like to overwrite the function in the place (controller or service of the page) where I call of the bugged function.

Is this even possible? If so, how can I best overwrite it?

Answer

You can create a decorator for the method you want change.

Suppose your factory looks like below

app.factory('myService',function(){
  return {
    getData: function() {
      // your code
    }
  };
});

Now if you want to change the functionality of getData() function, you can do it like below

app.config(function($provide) {

  $provide.decorator('myService', function($delegate) {
    var oldFunc = $delegate.getData;
    $delegate.getData = function() {
      // your updated code
      return oldFunc();
    };

    return $delegate;
  });
});
Comments