web-dev-qa-db-ja.com

なぜangular未定義を空のng-modelフィールドに設定するのか

Angular（1.2）およびLaravel（4.2））に単純なcrudアプリケーションがあります。単純なcrud操作には、効率的なEloquentメソッドを使用します。

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

これはリクエストペイロードからすべてのフィールドを取得しますが、空のフィールドでモデルを更新する必要がある場合に問題があります。

編集アクションには、サービスの$ resourcegetメソッドの応答が入力されたフォームがあります。

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の値は未定義に設定され、PUTリクエストに含まれないため、Laravelモデルの塗りつぶしメソッドはとにかくフィールドであり、検証のために空の値を設定しませんが、モデルの元の値を取ります。

問題は次のとおりです。未定義の代わりにngModelから空の文字列を送信するにはどうすればよいですか？

p.s.入力タイプがTextareaの場合、$ resourceは空の ""文字列を送信します：-/なので、混乱します...

angularjslaravelangular-resource
13
Karol F

入力に「required」ディレクティブがある場合、空の値が設定されることはありません（したがって、未定義になります）。

入力が空白の場合、モデルに格納する値が取得されないソースコード（ファイルinput.jsの「requiredDirective」）を参照してください。

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

私見それはとにかく少し奇妙なユースケースです：あなたはクライアント側の検証が必要ですが、それでもサーバーに無効な値を送信したいですよね？

それを行うために、独自の検証（ "my-required"）を作成できると思います。

または、データをサーバーに送信する前に、たとえばlodash（またはアンダースコア）を使用してデフォルト値をコピーすることもできます。

_.defaults（formData、{name： ""}）;

17
Stephen Friedrich

allowInvalidのプロパティngModelOptionsで値が無効な場合でも、モデルを設定するようにangularを構成できます。

allowInvalid：モデルを未定義に設定するデフォルトの動作の代わりに、正しく検証されなかった値でモデルを設定できることを示すブール値。

APIリファレンス

例：

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