including external js file into angular

Question

I have a java script file that contains a config object for decoding a lot of business jargon for ease of use in my application.

How can I get that to be available to my angular app? I currently have it included in my html file above all the application files.

here is my config.js:

var config = {
    "metadata":[
              "8235205241531AF399B113140005492E":{
                    "name":"verison_number"
               }
     ]
 }

here is includes:

        <script src="libs/bootstrap/dist/js/bootstrap.min.js"></script>
        <script src="libs/angular/angular.min.js"></script>
        <script src="libs/angular-resources/angular-resource.min.js"></script>
        <script src="libs/angular-route/angular-route.min.js"></script>
        <script src="js/config.js"></script>
        <script src="js/viewer.js"></script>
        <script src="js/controller.js"></script>
        <script src="js/services.js"></script>
        <script src="js/routes.js"></script>
        <script src="js/app.js"></script>

now here is my controller just trying to do a console.log on it:

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


MainCtrl.controller('loader',['$scope','$rootScope','$http','startApp', function($scope,$rootScope,$http,startApp) {
    console.log(config);
    console.log('loading course...');
    console.log(startApp);
}]);

if you have it in the html that contains angular script then angular has the access if the config object is global. — V31
– V31, Commented Sep 19, 2014 at 16:41
do I need to inject it into my app? It's coming up as not defined. — Jason Spick
– Jason Spick, Commented Sep 19, 2014 at 16:44
@JasonSpick the only way I can see that not working is if you haven't instantiated that controller with ng-controller on the current route. In other words - none of the controller code would be running at all. — m59
– m59, Commented Sep 19, 2014 at 16:53

V31 · Accepted Answer · 2014-09-19 16:56:25Z

2

Your JSON is incorrect.

Here is the correct way for declaring config:

var config = {
"metadata":[
    {"8235205241531AF399B113140005492E":"verison_number"}
]}

Working Plunkr

answered Sep 19, 2014 at 16:56

V31

7,6643 gold badges28 silver badges44 bronze badges

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

7 Comments

m59 Over a year ago

Heheh, so obvious! Sometimes it's hard to see those. Good job!

m59 Over a year ago

I would update your answer that it is improper and bad for testing to use a global variable like that. He ought to set an angular service/value and inject it where needed.

V31 Over a year ago

Thanks @m59!! appreciate that! @Jasonspick: Have a working fiddle over here...I guess there might be an issue in some of the other js files. Is there any console error?

V31 Over a year ago

@JasonSpick: Which code is updated? the json appears to be the same that you had earlier?

Jason Spick Over a year ago

no, I didn't have objects in the array. I think what I am struggling with is getting the array to read key value.

|

alpinescrambler · Accepted Answer · 2014-09-19 16:55:26Z

0

Maybe using the value recipe. For example:

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

// later

app.value('myconfigs',config); // set your "object"

// somewhere in your controller code

MainCtrl.controller('loader',['$scope','$rootScope','$http','startApp','myconfigs', function($scope,$rootScope,$http,startApp, myconfig) {
    console.log(myconfig.metadata);
    console.log('loading course...');
    console.log(startApp);
}]);

answered Sep 19, 2014 at 16:55

alpinescrambler

1,9641 gold badge17 silver badges28 bronze badges

1 Comment

m59 Over a year ago

That isn't going to solve the problem. If config is truly undefined, then you're just setting the value to undefined.

Collectives™ on Stack Overflow

including external js file into angular

2 Answers 2

7 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related