为什么角度设置未定义为清空ng-model字段

Question

我在Angular(1.2)和Laravel(4.2)中有简单的crud应用程序.对于简单的crud操作,我使用高效的Eloquent方法:

$product->fill(Input::all());

从请求有效负载中获取所有字段,但是当我需要使用空字段更新模型时会出现问题.

在编辑操作中,我有一个表单,其中填充了我的服务的$ resource get方法的响应:

adminModule.factory 'Product', ($resource) ->
  $resource '/admin/products/:id', { id: '@id' }, {
    query: { method: 'GET', isArray: false }
    update: { method: 'PUT' }
  }

控制器:

adminModule.controller 'ProductFormEditController', ($scope, Product, $stateParams) ->

  $scope.formData = Product.get({id: $stateParams.id})

和HTML:

    <input  type="text" data-ng-model="formData.name" name="name" class="form-control" id="name"
                           placeholder="Nazwa" data-server-error required>

如果我清除此字段值并提交$ scope.formData的值设置为undefined并且PUT请求中没有包含,那么Laravel模型填充方法无论如何都看不到该字段并且不设置为空验证的值,但采用模型的原始值.

问题是:如何从ngModel而不是undefined发送空字符串？

ps如果输入类型是Textarea,$ resource发送空""字符串: - /,所以我很困惑......

Answer 1

即使值与属性allowInvalidfrom 无效,您也可以配置角度来设置模型ngModelOptions.

allowInvalid:boolean值,表示可以使用未正确验证的值设置模型,而不是将模型设置为undefined的默认行为.

API参考

例:

<input 
   type="text" 
   ng-model="myvalue"
   ng-model-options="{ allowInvalid: true }"/>

Answer 2

如果输入上有"required"指令,则永远不会设置空值(因此它将是未定义的).

请参阅源代码(文件input.js中的"requiredDirective"),其中当输入为空时,没有检索到要存储在模型中的值:

if (attr.required && ctrl.$isEmpty(value)) {
   ctrl.$setValidity('required', false);
      return;
   } else {
      ctrl.$setValidity('required', true);
      return value;
}

恕我直言,这是一个有点奇怪的用例:你确实想要客户端验证,但仍然想向服务器提交无效值,对吧？

我想你可以编写自己的验证("我需要")来做到这一点.

或者,您可以在将数据发布到服务器之前复制默认值,例如使用lodash(或下划线):

_.defaults(formData,{name:""});