kay00
kay00

Reputation: 447

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

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

Upvotes: 2

Views: 725

Answers (2)

brennan
brennan

Reputation: 131

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"

Upvotes: 0

caffeinated.tech
caffeinated.tech

Reputation: 6548

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.

Upvotes: 3

Related Questions