angular ui.bootstrap not working

Question

I am having some trouble getting the popover element to work in an angular app using ui.bootstrap - here is some code:

in the app.js file, I am requiring ui.bootstrap

angular.module('developerPortalApp', [
    'ui.bootstrap'
  ])

The html element I am trying to attach a popover to

<div ng-controller="LoginCtrl">
    <a href="#" popover-placement="right" popover="On the Right!">how do I register?</a>
</div>

The popover content isn't going to be dynamic so there isn't anything in the controller for that. This is my first time using angular-bootstrap, so, is there something simple that I'm missing?

Any help is very much appreciated.

I should also add that ui-bootstrap-tpls.js is being loaded with the page — salxander
– salxander, Commented Feb 4, 2015 at 19:15

squiroid · Accepted Answer · 2015-02-04 19:16:48Z

4

May be you are missing some script file:-

Here is working example of your question:-

<!doctype html>
<html ng-app="ui.bootstrap.demo">
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.js"></script>
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.js"></script>
    <script src="example.js"></script>
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>

<div ng-controller="LoginCtrl">
      <a href="#" popover-placement="right" popover="On the Right!">how do I register?</a>

</div>
  </body>
</html>

http://plnkr.co/edit/E2LbaCoHKHKzifeL5Hny?p=preview

answered Feb 4, 2015 at 19:16

squiroid

14.1k7 gold badges50 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

salxander Over a year ago

Well, admittedly I'm at somewhat of a loss. I seem to have things setup correctly according to this but it still isn't working. The only other difference I can think of is that the <a> tag I'm trying to place the popover on is contained within a jumbotron and a form, but I don't see how that would affect things :(

squiroid Over a year ago

Can you make a plunker ?

squiroid Over a year ago

I checked it with jumbotron and form it is still working :-) plnkr.co/edit/E2LbaCoHKHKzifeL5Hny?p=preview

user1889992 Over a year ago

I did not test what I am about to say, but to confirm the popover working in plunker, you should be using uib version of popover. Bootstrap CSS uses just popover.

PsyGik Over a year ago

@user1889992, I, for one, had to remove uib- prefix to get it working on a yeoman scaffolded app. uib- prefix was introduced in 0.14.0 as documented here github.com/angular-ui/bootstrap/wiki/…

|

Collectives™ on Stack Overflow

angular ui.bootstrap not working

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related