0

私は小さな問題に直面しています。私は自分の機能をほとんど使い果たしました。

複数のプロジェクトを送信するためのオプションをユーザーに提供するフォームがあります。これは、「さらに追加」機能をクリックした後のドロップダウンリストの動的生成によって容易になります。これで、ユーザーが生成したドロップダウンリストをいくつでも作成できるようになりました。配列内の値をキャッチし、それをサーバーに送信してデータベースに保存しています。

HTMLコードは次のとおりです。

<form name="form" class="form-horizontal" ng-submit="save()" style="margin-left:220px;">
        <table cellpadding="10">    
<tr>
                <td></td>
                <!--data-ng-repeat='item in array'-->
                <td style="width: 270px;">
                    <div>
                        <div ng-controller="AlertDemoCtrl">
                            <alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)" ng-model="ProjectId[item]">
                        <ul style="list-style-type: none; margin-left: 0px;">
                            <li >
                                <!--data-ng-model="selectedProject[$index]"-->
                                <!--data-ng-model="test.ProjectId"-->
                                <!--<select data-ng-model="test.ProjectId" 
                                data-ng-options="test.ProjectId as test.ProjectName for test in items" id="Project">-->
                                <select>
                                    <option value="">-- Choose a Project --</option>
                                    <option ng-repeat="item in items" value="{{item.ProjectId}}">{{item.ProjectName}}</option>
                                </select>
                                <button type="button" ng-click="closeAlert($index)"><img src="delete.png" alt="Remove" style="height:20px; width:20px;" /></button>
                            </li>
                        </ul>
                    </alert>
                            <button class='btn' type='button' ng-click="addAlert()">Add Projects</button>
                        </div>
                    </div>
                </td>
                <td>
                    <label id="Label2" style="color: red"></label>
                </td>
            </tr>
</table>
        <div style="margin-left: 200px;">
            <input type="submit" class="btn btn-primary" name="Submit" value="Submit" onclick="return validateForm()" />
            <a href="#/emp" class="btn">Cancel</a>
        </div>

    </form>

ALERT は、「さらに追加」をクリックして動的なドロップダウンリストを生成できるようにするカスタム ディレクティブです。

app.js のコントローラーのコード

var CreateCtrlEmp = function ($scope, $location, SampleEmp, SampleProj, SampleDes, sharedValues) {
$scope.items = SampleProj.query({ q: $scope.query });
$scope.itemsd = SampleDes.query({ q: $scope.query });
$scope.save = function () {
    //issue over here
    $scope.item.ProjectId = [];
    SampleEmp.save($scope.item);
    $location.path('/emp');
};};

現在、サーバー側のコードで選択した値を取得していません。考えられる問題は次のとおりです。

  1. コードは値をサーバー側コードに送信できません。つまり、空の配列を渡しています。
  2. $scope.item.ProjectId = []; の初期化 投稿された値を上書きしているため、空の配列を取得しています。

注: 次のようなコントローラーで静的な値を渡す場合:

$scope.item.ProjectId = [5,7];

機能は正常に動作しています。

ガイドしてください。

ありがとうございます！

トゥシャル・シャルマ

4

1 に答える 1

0

選択した値をモデルに保存し、ng-submit でモデルを送信する必要があります。また、選択タグで ng-repeat 入力オプションを使用することもお勧めしません。ng-model は value="" と等しいことに注意してください。モデルの内容は、送信される内容です。ビューの読み込み時に何かを事前に選択したい場合にも、モデルを使用します。

このようなことをしてください（あなたの例のミニバージョン）：

テンプレート

<form name="form" class="form-horizontal" ng-submit="save(myForm)" style="margin-left:220px;">

    <table cellpadding="10">    
        <tr>
            <td style="width: 270px;">
                <div>
                    <div ng-controller="AlertDemoCtrl">
                        <alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)" ng-model="ProjectId[item]">
                    <ul style="list-style-type: none; margin-left: 0px;">
                        <li >
                            <!--data-ng-model="selectedProject[$index]"-->
                            <!--data-ng-model="test.ProjectId"-->
                            <!--<select data-ng-model="test.ProjectId" data-ng-options="test.ProjectId as test.ProjectName for test in items" id="Project">-->
                            <select ng-model="myForm.project" ng-options="test.ProjectId as test.ProjectName for test in items">
                                <option>-- Choose a Project --</option>
                            </select>
                        <li>
                    </ul>
                </div>
            </td>       
        </tr>
    </table>
    
</form>

コントローラ

$scope.save = function (myForm) {
    SampleEmp.save(myForm);
    $location.path('/emp');
};
于 2013-09-13T12:01:48.420 に答える