CODEWITHSUNDEEP
angularjstwitter-bootstrapangular-ui-bootstrap
user3159568
user3159568

Reputation: 41

AngularJS and Twitter Bootstrap

I was wondering if there are any conventions I need to follow if I want to implement twitter bootstrap into my angularJS application or is angular just unobtrusive with twitter bootstrap?

Upvotes: 0

Views: 204

Answers (1)

Saravana Kumar
Saravana Kumar

Reputation: 836

You need to wrap bootstrap javascript component individually in a directive to make it work. Below is an example to make modal javascript plugin work with angular.

There is an active community Angular UI bootstrap which does implements bootstrap javascript plugins as Angular directive effectively.

I feel, writing my own directive makes customization easy and no need for heavy javascript library files in your web application.

angular.module(app.name).directive('modaldir', function() {
  return {
    restrict: 'A',
    // The linking function will add behavior to the template
    link: function(scope, element, attrs) {
      console.log("inside modal");
      element.click(function(e) {
        e.preventDefault();
        var href = element.attr('href');
        console.log(href);
        $(href).modal();
      });
    }
  };
})

HTML:

  <a data-toggle="modal" href="#myModal" modaldir class="pull-right password-retrieve"  >Forgot your password?</a>

Upvotes: 2

Related Questions