AngularJS - 简单$ scope console.log()返回undefined

Question

我试图console.log()从这个$范围做一个简单的事情:

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

这是我的javascript文件:

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

  console.log($scope.customer);

});

但日志返回我未定义.这有什么问题？

这是傻瓜:http://plnkr.co/edit/MU2i46o03bs22Jwh6QIe

Answer 1

正如其他人所说,您需要初始化客户对象.

由于没有来自控制器的客户集值,因此它在视图中显示为未定义.在输入框中输入值时,这将不再是未定义的,但由于最初只进行一次记录,因此在输入框中键入值无效

Plunker演示

这是我在script.js中更改的部分

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

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

console.log($scope.customer);

});