单击控制器操作时未设置ng-model数据

时间:2017-08-30 09:07:47

标签: angularjs

Html页面定义为

        <div class="form-group col-sm-12">
            <label  class="control-label col-md-2">Person Type</label>
              <div class="col-sm-10">
                <select class="form-control m-b" name="account" ng-model="person.type">
                  <option value="0" label="please select...">please select...</option>
                  <option value="Self"> Self </option>
                  <option value="Employee"> Company Employee </option>
                </select>
              </div>
            </div>

            <div class="form-group col-sm-12">
              <label class="control-label col-md-2">Person Name</label>
              <div class="col-sm-10">
                <input class="form-control m-b" type="text" placeholder="Enter name of Person" ng-model="name">
              </div>
            </div>

控制器功能定义如下

       controller('ClientCtrl' , function($scope, $http){     
        $scope.UpdatePerson= function(name, type){
        $scope.name= name ;
        $scope.person.type = type;
       };  })

在更新值“$ scope.name”值更改但“$ scope.person.type”发出错误

之后
TypeError: Cannot set property 'type' of undefined
at ChildScope.$scope.UpdatePerson (controller.js:277)
at fn (eval at compile (angular.js:15500), <anonymous>:4:1156)
at callback (angular.js:27285)
at ChildScope.$eval (angular.js:18372)
at ChildScope.$apply (angular.js:18472)
at HTMLButtonElement.<anonymous> (angular.js:27290)
at HTMLButtonElement.dispatch (jQuery-2.1.4.min.js:3)
at HTMLButtonElement.r.handle (jQuery-2.1.4.min.js:3)

2 个答案:

答案 0 :(得分:0)

您没有已定义的$ scope.person

$scope.person = {};
$scope.UpdatePerson= function(name, type){
    $scope.name= name ;
    $scope.person.type = type;
};

我认为这是格式化了我,认为只是一些vars正在初始化。

答案 1 :(得分:0)

问题是person未定义: 我认为这是解决方案: 使用ng-init以防止这样覆盖:

<div class="form-group col-sm-12" ng-init="person={}">
        <label  class="control-label col-md-2">Person Type</label>
          <div class="col-sm-10">
            <select class="form-control m-b" name="account" ng-model="person.type">
              <option value="0" label="please select...">please select...</option>
              <option value="Self"> Self </option>
              <option value="Employee"> Company Employee </option>
            </select>
          </div>
        </div>

        <div class="form-group col-sm-12">
          <label class="control-label col-md-2">Person Name</label>
          <div class="col-sm-10">
            <input class="form-control m-b" type="text" placeholder="Enter name of Person" ng-model="name">
          </div>
        </div>