How to setup Angular example app in jsFiddle?

Question

So I'm trying to setup my Angular app example in jsFiddle to get help on another bug, however I'm getting a new bug:

enter image description here

Added example in Plunker: http://plnkr.co/edit/yYQHbcatHOu5myL4MXZM?p=preview

I wasn't able to add ng-app="portal" to the html tag because jsFiddle generates it's own html tag in the output, so I put ng-app in my first div, could that be the problem?

"Uncaught Error: [$injector:nomod] Module 'portal' is not available!

HTML

 <div class="nav"
     ng-app="portal"
     ng-controller="NavController as nav">

Angular

var app = angular.module('portal');

// Controller for Nav
app.controller('NavController', function() {
    ....

If it can't find portal because of that issue, how would you setup an Angular app in jsFiddle?

Read the whole error message, please: Module 'portal' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. — Blackhole
– Blackhole, Commented Oct 9, 2014 at 16:02
I personally always have issues getting angular to play nice in a JSFiddle - so tend to use plnkr.co/edit/?p=catalogue - it also updates as soon as you make changes, rather than having to press run. Food for thought... — Darren Wainwright
– Darren Wainwright, Commented Oct 9, 2014 at 16:03
@Blackhole well obviously you can see for yourself that I did not misspell 'portal' try again... — Leon Gaban
– Leon Gaban, Commented Oct 9, 2014 at 16:04
By "whole error message", I mean "also the last sentence"… And by the way, use the option "No wrap - in <head>" in JSFiddle. — Blackhole
– Blackhole, Commented Oct 9, 2014 at 16:05
@Darren thanks! I'm trying to setup my example app here now: jsfiddle.net/leongaban/scx479rw however looks like the style isn't working — Leon Gaban
– Leon Gaban, Commented Oct 9, 2014 at 16:12

sylwester · Accepted Answer · 2014-10-09 16:20:33Z

2

Please see here http://jsfiddle.net/dvtofn6L/1/

You missed few bits 1:

var app = angular.module('portal', []);

2.

app.controller('SubNavController', function ($scope) {})

Reference to jquery (you can add that in external source tab)

https://code.jquery.com/jquery-1.11.1.min.js

answered Oct 9, 2014 at 16:20

sylwester

16.5k1 gold badge27 silver badges33 bronze badges

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

Collectives™ on Stack Overflow

How to setup Angular example app in jsFiddle?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related