Angular and Asp.Net, can't reference angular js from Script Directory

Question

Going over this tutorial. http://codewala.net/2014/05/28/learning-angularjs-with-examplespart-1/

I used nuget to get angular js (angularjs.html)

I replaced

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>

with

  <script src="Scripts/angular.js" type="text/javascript"></script>

This breaks even though the Scripts directory contains angular.js.

Complete code:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Hello world with AngularJS</title>
    <script src="Scripts/angular.js" type="text/javascript"></script>
</head>
    <body style="font-family:Verdana, Geneva, 'DejaVu Sans', sans-serif">
        <h1 ng-app ng-controller="HelloWorldCtrl"> {{helloWorldMessage}}</h1>

        <script type="text/javascript">
            function HelloWorldCtrl($scope) {
                $scope.helloWorldMessage = "Hello World " + (new Date()).toDateString();
            }
        </script>
    </body>
</html>

Error: Argument 'HelloWorldCtrl' is not a function, got undefined

Are you sure it's in said directory? Add a simple js file triggering an alert('hello'); in the same directory and include it. Otherwise, are you sure it's the same version? There have been many changes since 1.0.7. What error do you get in the console? And are you hosting the code or is it static? — caffeinated.tech
– caffeinated.tech, Commented Oct 22, 2014 at 17:12
I was able to get the alert. Not the same version but this is just a hello world. I got angular.js from nuget. Error is Argument 'HelloWorldCtrl' is not a function, got undefined. Just running from my desktop in vs2013 — kay00
– kay00, Commented Oct 22, 2014 at 17:22
What's the error you get? Where does it look for the file exactly? Is the Angular file marked as Content? — Ufuk Hacıoğulları
– Ufuk Hacıoğulları, Commented Oct 22, 2014 at 17:23
Thanks, that rules out the obvious, I believe it's a problem with the version , I'm assuming your local one is 1.2.x? — caffeinated.tech
– caffeinated.tech, Commented Oct 22, 2014 at 17:25

caffeinated.tech · Accepted Answer · 2014-10-22 17:30:47Z

3

The syntax you are using is often used in examples due to it's brevity but typically you see apps and controllers defined like this:

app = angular.module("myapp", []);

app.controller("HelloWorldCtrl", function($scope) {
    $scope.helloWorldMessage = "Hello World " + (new Date()).toDateString();
});

Then your HTML should be:

<body ng-app="myapp" style="font-family:Verdana, Geneva, 'DejaVu Sans', sans-serif">
    <h1 ng-controller="HelloWorldCtrl"> 
        {{helloWorldMessage}}
    </h1>
</body>

Without knowing what error you're getting it's hard to say why your code isn't working, but give the above a try and if there are still problems just comment and I'll help. Good luck.

answered Oct 22, 2014 at 17:30

caffeinated.tech

6,5561 gold badge24 silver badges41 bronze badges

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

Comments

brennan · Accepted Answer · 2014-10-22 17:39:31Z

0

I'd recommend putting {{ 1 + 2 }} in your html just to verify Angular is loaded (if it works, it'll render as 3). If that doesn't work, it's a problem with your path. If it's not inside the same folder your html file is in, you might need src="../Scripts/angular.js"

answered Oct 22, 2014 at 17:39

brennan

1315 bronze badges

2 Comments

Semicolon Over a year ago

Isn't it already clear that Angular is loading? The error message -- about not finding a controller by that name -- is coming from Angular.

brennan Over a year ago

Ah I didn't see that, I just saw that it wasn't a function. This might not be the answer in this situation, but the {{ 1 + 2 }} test helped me troubleshoot when I was learning so might help someone else.

Collectives™ on Stack Overflow

Angular and Asp.Net, can't reference angular js from Script Directory

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related