My first example of Angular error

295 views
Skip to first unread message

Fernando Villarroel

unread,
Mar 27, 2016, 9:03:54 PM3/27/16
to AngularJS
Dear All

This is my first post, i am new user of Angular.

I am trying to follow the next example but not works.

<!DOCTYPE html>

<html>

 <head>

<meta charset="UTF-8">

<title>AngularJS</title> 

</head>

<body ng-app>

<script>

function miCtrl ($scope) {

        $scope.mensaje = "Mensaje desde el Controlador";

        }

</script>

<script src="bower_components/angular/angular.js"></script> </body>

<div class="container" ng-controller="miCtrl">

<h1>{{mensaje}}</h1>

</div>

</body>

</html>


I did installed Angular from Bower.

If i use the CDN


https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js


the example works fine


If i use local angular i received:


angular.js:13424 Error: [ng:areq] Argument 'miCtrl' is not a function, got undefined

http://errors.angularjs.org/1.5.3/ng/areq?p0=miCtrl&p1=not%20a%20function%2C%20got%20undefined

    at angular.js:68

    at assertArg (angular.js:1844)

    at assertArgFn (angular.js:1854)

    at $controller (angular.js:10003)

    at setupControllers (angular.js:9138)

    at nodeLinkFn (angular.js:8936)

    at compositeLinkFn (angular.js:8333)

    at compositeLinkFn (angular.js:8336)

    at publicLinkFn (angular.js:8213)

    at angular.js:1715



What i doing wrong?

Regards

Anthoni Gardner

unread,
Mar 28, 2016, 4:13:33 AM3/28/16
to AngularJS
Hi,

Try putting your script tag into a seperate file and load it AFTER angular file has been referenced.
It's saying that angular can not find your controller and what I think is happening is it's falling through to your container and trying to instantiate it without angular being fully loaded yet.

Try the seperate file and see if that solves your problem.
If not, message back :)

Regards
Anthoni

Fernando Villarroel

unread,
Mar 28, 2016, 9:46:14 AM3/28/16
to AngularJS
Dear Anthoni.

I separate scripts like this:

The index.html file:

<!DOCTYPE html>

<html lang="en">

 <head>

<meta charset="UTF-8">

<title>AngularJS</title> 

</head>

<body ng-app>

<script src="bower_components/angular/angular.js"></script>

<script src="app.js"></script>


<div class="container" ng-controller="miCtrl">

<h1>{{mensaje}}</h1>

</div>


</body>

</html>


The app.js :


function miCtrl ($scope) {

        $scope.mensaje = "Mensaje desde el Controlador";

        }


But the error still continue:


angular.js:13424 Error: [ng:areq] Argument 'miCtrl' is not a function, got undefined

http://errors.angularjs.org/1.5.3/ng/areq?p0=miCtrl&p1=not%20a%20function%2C%20got%20undefined

    at angular.js:68

    at assertArg (angular.js:1844)

    at assertArgFn (angular.js:1854)

    at $controller (angular.js:10003)

    at setupControllers (angular.js:9138)

    at nodeLinkFn (angular.js:8936)

    at compositeLinkFn (angular.js:8333)

    at compositeLinkFn (angular.js:8336)

    at publicLinkFn (angular.js:8213)

    at angular.js:1715



Regards

Josiah Solomon

unread,
Mar 28, 2016, 12:04:01 PM3/28/16
to AngularJS
Fernando,

Por favor show us your app.js

Thanks

Leandroh

unread,
Mar 28, 2016, 12:27:00 PM3/28/16
to ang...@googlegroups.com
Hi, Fernando.

I think you probably forget to 'register' your controller in your application.

Let's do a couple of changes in your code.

Take a look at the html file: https://gist.github.com/leandroh/105d397e758856ea728c
And the js file: https://gist.github.com/leandroh/a1ea63d6480fb81bd2b2

Remember, if you want to use a controller, service etc. You should 'register' all of them in your app module.

More info: https://docs.angularjs.org/guide/controller

Fernando Villarroel

unread,
Mar 28, 2016, 9:25:57 PM3/28/16
to AngularJS
Dear all.

Now it's works thank you everyone for your answers and help.
Tell me what document recomended for begginer?

Regards

Josiah Solomon

unread,
Mar 28, 2016, 9:44:49 PM3/28/16
to AngularJS
depends on your back ground and experience but this is what I started out with and it helped me a lot!!!

Sasi Kumar

unread,
Mar 29, 2016, 12:43:04 AM3/29/16
to ang...@googlegroups.com
Hi Leandroh,

As he said if he use cdn path its is working fine there itself he doesn't register with module then how it is working ?

why we should register our controller or service to application  while  loading  angular from local?


--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.



--
Thanks & Regards,

Sasikumar.V

Anthoni Gardner

unread,
Mar 29, 2016, 5:47:12 AM3/29/16
to AngularJS
I would also recommend that you read through, if not follow through exactly, the official angularjs tutorial
https://docs.angularjs.org/tutorial

AngularJS is seriously powerful and very flexible and one of the most stable frameworks I've ever used, but
it also have a steep learning curve (especially directives).

Worth it though :)
Anyway, that tutorial will get your feet wet and on the road to good design.

I would also recommend reading through John Papa's style guide once you have finished the tutorial.

Regards
Anthoni

Andrés Mirabal

unread,
Jun 23, 2017, 12:13:07 PM6/23/17
to Angular and AngularJS discussion
Hi.

If you use this, it will work....


if you use this, doesnt work:

with newer versión of angualar  you must registrer your controller  like leandroh said....

Sander Elias

unread,
Jun 23, 2017, 12:18:28 PM6/23/17
to Angular and AngularJS discussion
Hi Andrés,

I think he has figured this out during the past year ;) the post is 15 months old!

Regards
Sander
Reply all
Reply to author
Forward
0 new messages