AngularJS - Simple $ scope console.log () returns undefined

Question

I am trying to make a simple console.log() from this $ scope:

 <div ng-controller="CustomerController" id="customer-block"> <h3>Customer Information</h3> <div class="col-md-4"> <label>Address 1:</label> <input type="text" ng-model="customer.address1" class="form-content" id="customer-address1" /> </div> <div class="col-md-4"> <label>Address 2:</label> <input type="text" ng-model="customer.address2" class="form-content" id="customer-address2" /> </div> <div class="col-md-4"> <label>City</label> <input type="text" ng-model="customer.city" class="form-content" id="customer-city" /> </div> </div> 

This is my javascript file:

 lima3app.controller("CustomerController", function($scope){ console.log($scope.customer); }); 

But the log returns me undefined . What's wrong with it?

This is plunkr: http://plnkr.co/edit/MU2i46o03bs22Jwh6QIe

Answer 1

As others have said, you need to initialize the client object.

Since there is no client set value on the controller, it is displayed as undefined in the view. When you enter values ​​in the input fields, it will no longer be undefined, but since logging is performed only once initially, entering values ​​in the input field has no effect

Plunger Demo

Here is the part I changed in script.js

 lima3app.controller("CustomerController", function($scope){ $scope.customer = { address1 : 'address1', address2 : 'address2', city:'city' } console.log($scope.customer); }); 

Answer 2

Because your js code

 console.log($scope.customer); 

starts when the CustomerController starts, while $ scope.customer does not matter and returns undefined.