Menu
I noticed the same question was asked a few times here, I tried so solve it but nothing helps.
I'm following this tutorial with the egghead videos.
But when I get at the section of Controllers and Sharing data between controllers, I can't get it to work.
When I run it with Chrome, I get this error in the console:
'argument 'FirstCtrl' is not a function, got undefined'.
I really don't know what's wrong. The code is the same from in the tutorial.
HTML
<!DOCTYPE html>
<html ng-app>
<head>
<title>AngularJS Tutorials: Controllers</title>
<link rel="stylesheet" href="mystyle.css">
<script src="http://code.angularjs.org/1.2.0-rc.2/angular.min.js"></script>
</head>
<body>
<div ng-app="">
<div ng-controller="FirstCtrl">
<h1> {{data.message + " world"}}</h1>
<div class="{{data.message}}">
Wrap me in a foundation component
</div>
</div>
</div>
<script type="text/javascript" src="main.js"></script>
</body>
</html>
main.js
function FirstCtrl($scope){
$scope.data = { message: "Hello" };
}
429
You have 2 unnamed ng-app directives in your html.
Lose the one in your div.
Update
Let's try a different approach.
Define a module in your js file and assign the ng-appdirective to it. After that, define the controller like an ng component, not as a simple function:
<div ng-app="myAppName">
<!-- or what's the root node of your angular app -->
and the js part:
angular.module('myAppName', [])
.controller('FirstCtrl', function($scope) {
$scope.data = {message: 'Hello'};
});
Here's an online demo that is doing just that : http://jsfiddle.net/FssbL/1/
106
I got exactly the same error message and in my case it turned out i didn't list the controller JS file (e.g. first-ctrl.js) in my index.html
20
I just did this tutorial and followed @gion_13 answer. Still did not work. Solved it by making my ng-app name in the index identical to the one in my js file. Exactly identical, even the quotes. So:
<div ng-app="myapp">
<div ng-controller="FirstCtrl">
and the js:
angular.module("myapp", [])
.controller('FirstCtrl',function($scope) {
$scope.data= {message:"hello"};
});
Weird how the ng-app has to be identical but the ng-controller doesn't.
9
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
