0

I'm trying to create a new angularjs controller and this error just don't want to dissapear:

Argument 'AppController' is not a function, got undefined

My code:

var app = angular.module('myApp', [])
.controller('AppController', function($scope) {
    $scope.data = 'Hello';
});

app.html.twig

<div ng-app="myApp">
<div ng-controller="AppController">
    <h1> {{'{{ data }}' }}</h1>

</div>

I really don't understand what am I missing. I ve searched for this error, and I tried the solutions presented but I can not resolve it. Any ideas?

8
  • may be this what you need stackoverflow.com/a/25895387/1054978 Commented Aug 7, 2017 at 9:09
  • Possible duplicate of Angularjs: Error: [ng:areq] Argument 'HomeController' is not a function, got undefined Commented Aug 7, 2017 at 9:10
  • Try: var app = angular.module('myApp', []); app.controller... Commented Aug 7, 2017 at 9:12
  • @RamsingNadeem still the same error.. Commented Aug 7, 2017 at 9:12
  • @Mourya already checked that solution, but with not success. In my configuration I have: angular.module('myApp', []); And I access it only once so don't see the point Commented Aug 7, 2017 at 9:14

4 Answers 4

0

Here is your own code. Please go through it and for more just go to plunker

 //JS code
    var app = angular.module('myApp', [])
    .controller('AppController', function($scope) {
        $scope.data = 'Hello';
    });




    //template code
        <div ng-app="myApp">
            <div ng-controller="AppController">
              <h1> {{data}}</h1>
           </div>
         </div>
Sign up to request clarification or add additional context in comments.

3 Comments

in the plunker it works but in my app it doesn't and I don't know why..
Are you closing your <div> tag properly?
Yes, yes.. @Jverma
0

I think you should keep it separate like this, it'll work

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

OR

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

app.controller('AppController', function($scope) {
    $scope.data = 'Hello';
});

Also this syntax is wrong but your error is not because of this

<h1> {{'{{ data }}' }}</h1>

Change

<h1> {{ data }}</h1>

Comments

0

Try to create like this

var jimApp = angular.module("mainApp",  []);

    jimApp.controller('mainCtrl', function($scope){
      $scope.data = 'Hello';
    });


<div ng-app="mainApp" ng-controller="mainCtrl">
    {{ data }}
</div>

Comments

0

var app = angular.module('myApp', [])
app.controller('AppController', function($scope) {
    $scope.data = 'Hello';
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="AppController">
      <h1> {{data}}</h1>
  </div>
</div>

{{'{{ data }}' }} =======> {{data}}

I created a snippet with your provided code and jut this part in html and it's working now. Kindly check this answer.

Thank you.

3 Comments

still not working.. should I declared also in another place?
if you can provide your problem with a plunker that would be helpful for us to find out the issue.
markup structure fine? Because the code you provided is missing one closing div.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.