1

私のフォームには、タイプごとに異なるフィールドがあります。

<form>
    <select ng-model="message.type">
         <option>SMS</option>
         <option>Email</option>
    </select>

    <div ng-if="message.type=='sms'">
         <textarea ng-model="message.body"></textarea>
    </div>

    <div ng-if="message.type=='email'">
         <input type="text" ng-model="message.subject" />
         <textarea ng-model="message.body" class="ckeditor"></textarea>
    </div>
</form>

ユーザーが最初に電子メールを選択し、件名フィールドに何かを書き込んでからSMSタイプに戻すと、うまく機能しますが、$ http.postでメッセージオブジェクトを送信すると、domが要素が削除されました。

どうすれば修正できますか？既存の dom 要素にリンクされているデータのみを送信したい。

ありがとう

4

1 に答える 1

2

いくつかの解決策を想像できます：

不適切な属性を削除する

選択したオプションが変更されたときにこれを行うことができます。

$scope.deleteInappropriateAttribute = function () {
    if ($scope.message.type !== 'email') {
        delete $scope.message.subject;
    }
};

<select ng-model="message.type" ng-change="deleteInappropriateAttribute()">
     <option>SMS</option>
     <option>Email</option>
</select>

フォームを投稿する直前にこのアクションを実行すると、ユーザーがmessage.subjectさまざまなオプションを頻繁に切り替えている場合に、フォームを書き換える必要がなくなります。

フォームの各部分に異なる変数を関連付ける

<form>
    <select ng-model="message.type">
         <option>SMS</option>
         <option>Email</option>
    </select>

    <div ng-if="message.type=='sms'">
         <textarea ng-model="message.global.body"></textarea>
    </div>

    <div ng-if="message.type=='email'">
         <input type="text" ng-model="message.email.subject" />
         <textarea ng-model="message.global.body" class="ckeditor"></textarea>
    </div>
</form>

次に、適切な変数のみを投稿します。

$http.post(
    'myUrl.php',
    angular.extend(
        {},
        $scope.message.global,
        $scope.message[$scope.message.type]
    )
);
于 2014-05-18T10:01:13.907 に答える