CODEWITHSUNDEEP
javascriptasp.net-mvcangularjs
user1765862
user1765862

Reputation: 14145

simple angularjs app, but I'm getting {{ this should be the data }}

simplest angularjs app

I've create asp.net mvc4 app and I'm installed angularjs package from nuget. Layout.cshtml is cleared and it's looked like this

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>

    <script src="~/Scripts/angular.js"></script>
    <script src="~/AngularJSApp/main.js"></script>
</head>
<body>
    <div ng-controller="homeController" class="container body-content">
        {{ testData }}
        @RenderBody()
    </div>
</body>
</html>

I've created main.js where I stored module and correspoding controller, just simple one

var app = angular.module("myApp");

app.controller('homeController', ['$scope', function ($scope) {
    $scope.testData = "this is test data";
}]);

I've double checked file references from _Layout.cshtml (both .js files are loaded)

but on rendering page I'm getting {{ testData }} instead of actual data.

What I'm missing here?

Upvotes: 1

Views: 67

Answers (2)

blfuentes
blfuentes

Reputation: 2827

Try with this in your main.js

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

You are missing the second parameter of the module method

Angular module reference

Upvotes: 1

Radim K&#246;hler
Radim K&#246;hler

Reputation: 123861

If you declare module, you should use:

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

This notation:

var app = angular.module("myApp");

could be used later to retrive that module and append stuff to it

The more other modules you will need, you can inject them into that array, e.g.

var app = angular.module("myApp", ['ui.router']);

Upvotes: 3

Related Questions