angularjs controller doesn't work

Question

The following code does not display firstName and lastName on screen. can any one point out what am I missing? Thanks.

<body ng-app="myApp">
<div  ng-controller="myCtrl">
  Full Name: {{name.firstName + " " + name.lastName}}
</div>

<script src="../bower_components/angular/angular.min.js"></script>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function() {
 var name={
  firstName: "John",
  lastName: "Doe"
 }
 this.name=name;
});

Use $scope . In this case, use it as $scope.name in your controller — Karthik
– Karthik, Commented Nov 26, 2015 at 4:34

Subin Sebastian · Accepted Answer · 2015-11-26 07:47:54Z

4

I think you are trying controller as syntax.If so

<div  ng-controller="myCtrl as myctrl">
  Full Name: {{myctrl.name.firstName + " " + myctrl.name.lastName}}
</div>

Otherwise you have to inject $scope and set name variable in $scope object.

var app = angular.module('myApp', []);
app.controller('myCtrl', ['$scope',function($scope) {
    var name={
       firstName: "John",
       lastName: "Doe"
    }
    $scope.name=name;
}]);

edited Nov 26, 2015 at 7:47

answered Nov 26, 2015 at 4:34

Subin Sebastian

11k3 gold badges39 silver badges44 bronze badges

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

1 Comment

Hashy Over a year ago

please reedit your ans $scope.name=name; }]); that square bracket comes before round bracket.

Collectives™ on Stack Overflow

angularjs controller doesn't work

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related