Can't get a simple angular-bootstrap example running on local machine

Question

I'm not able to run a simple angular-bootstrap example. It runs well on Plunkr or on JSFiddle, but NOT locally on my machine. It's about a tab bar, so I use

<uib-tabset>
    <uib-tab>
       ...
    </uib-tab>
</uib-tabset>

See this jsfiddle and this Plunker examples (both contain same code). They work like intended, showing me a tab bar with 3 tabs. Do I now put this code into a html file on my system and runs it locally, the following happens:

What is the reason behind this? The firefox console (F12) is empty, so there should be no error. Why can't I run my site locally? Do I need an extra server like tomcat for this? If yes, why? I just want to test something out real quick, I don't want to get a server only for this, except when it really is necessary...

PS: Note that these first steps actually worked! http://www.w3schools.com/angular/ But as soon as wanted to try out a tab bar, it keeps failing.

It contains the exact same code as the jsfiddle and the plunker links — BAERUS
– BAERUS, Commented Feb 28, 2016 at 15:06

AleFranz · Accepted Answer · 2016-02-28 11:24:47Z

1

As you are referencing the external resources with // (e.g. //ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js), you are not specifyng the protocol.

So when you access your file locally, it will keep the file:// protocol (e.g. file://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js) and this resources are obviously not available.

To solve the issue, you could use one of this methods:

explicitly specify to use http (e.g. http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js)
save the external scripts on the directory with your html file and then use a relative path (e.g. angular.js)

answered Feb 28, 2016 at 11:24

AleFranz

7811 gold badge7 silver badges14 bronze badges

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

3 Comments

BAERUS Over a year ago

I totally didn't see that ... why do they put such a referencing code into their examples? Damn :D Thank you very much, it works now.

JB Nizet Over a year ago

@BAER because angular is used to create web apps, and web apps are typically served... over the web, by a web server. There are many things you can't do when the app is served from the file system: ajax calls, thus routing, etc. Assuming you're using a web server is reasaonable, IMO, because you should be using one.

BAERUS Over a year ago

I understand, you seem to be right. Thanks for clarification.

Collectives™ on Stack Overflow

Can't get a simple angular-bootstrap example running on local machine

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related