AngularJS - Einfache $ scope console.log() gibt undefined

Question

Ich versuche, eine einfache console.log() von diesem $ Umfang zu machen:

<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> 

Dies ist mein Javascript-Datei:

lima3app.controller("CustomerController", function($scope){ 

    console.log($scope.customer); 

}); 

Aber Das Protokoll gibt mir undefined zurück. Was stimmt damit nicht?

Dies ist plunkr: http://plnkr.co/edit/MU2i46o03bs22Jwh6QIe

Answer 1

Wie die anderen bereits gesagt haben, müssen Sie das Kundenobjekt initialisieren.

Da vom Controller kein Wert für den Kunden festgelegt wurde, wird er in der Ansicht als undefiniert angezeigt. Wenn Sie Werte in den Eingabefeldern eingeben, wird dies nicht mehr undefiniert, aber da die Protokollierung wird nur einmal am Anfang getan, Werte in Eingabefeld eingeben keine Wirkung hat

Plunker Demo

Hier ist der Teil, den ich geändert habe in script.js

lima3app.controller("CustomerController", function($scope){ 

$scope.customer = { 
    address1 : 'address1', 
    address2 : 'address2', 
    city:'city' 
} 

console.log($scope.customer); 

}); 

Answer 2

Weil Ihr JS-Code

console.log($scope.customer); 

laufen, wenn Sie den CustomerController Controller init, zu diesem Zeitpunkt $ scope.customer keinen Wert hat und es nicht definiert zurück.