AngularJS - why controller is not working?

Question

I have this simple code in my app.js file:

(function(){
    var app = angular.module('searchHotels', []);

    app.controller = ("PlaceController", function(){
        this.place = shop;
    });

    var shop = {
        name: 'supermarket',
        distance: 100
    };
})();

Here is the index.html file's code:

<!doctype.html>
<html ng-app="searchHotels">

<head>
    <script type="text/javascript" src="angular.min.js"></script>
    <script type="text/javascript" src="app.js"></script>
</head>

<body>

    <div ng-controller="PlaceController as placeC">
        <h3> {{placeC.place.name}} </h3>
    </div>

</body>

</html>

In the output, my {{placC.place.name}} expression is not replaced by the data it was meant to show. It just outputs "{{placeC.place.name}}" itself. What am I missing here? Thanks!

And you are assigning undefined to this.place as variable shop is … undefined in that part of code. — Krzysztof Safjanowski
– Krzysztof Safjanowski, Commented Jul 19, 2015 at 12:21
@KrzysztofSafjanowski, nope, on moment call controller function - place already not undefined — Grundy
– Grundy, Commented Jul 19, 2015 at 12:23
@KrzysztofSafjanowski absolutely correct! Just putting the shop object before the controller made it right, I forgot that JS is only read top to bottom :) — AMAN AGARWAL
– AMAN AGARWAL, Commented Jul 20, 2015 at 19:53

dfsq · Accepted Answer · 2015-07-19 10:35:51Z

5

Angular controller definition is a method call, not assignment. Correct code:

app.controller("PlaceController", function(){
    this.place = shop;
});

answered Jul 19, 2015 at 10:35

dfsq

193k26 gold badges244 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS - why controller is not working?

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related