0

1. 次のマークアップを持つ AxleTypes というコレクションを持つ Truck クラスがあります。

public class AxleType : Entity
{
    public string Description { get; set; }
    public string Type { get; set; }
}

2.私のAngularフォームには次のものが含まれています(これをできるだけ短くするために、フォームの他のアクスルタイプを省略しました。これはテンプレートであり、メインフォームに含まれているため、$parentを使用しています):

<label for="frontAxles">Front Axle: </label>
<input ng-model="$parent.frontAxleType" type="hidden" value="Front">
<select ng-model="$parent.selectedFrontAxle" ng-options="axleType.Description for axleType in axleTypes">
    <option value="" selected>Select Axle Type ..</option>  
</select>

3. メイン フォームは、トラック コントローラーを介して新しいトラックを挿入するため、トラック コントローラーでは次のようになります。

  a. I instantiate an instance of the AxleTypes collection so the form is populates the select w/axle types.
  b. I instantiate an instance of AxleType to pass the selected data from the form.
  c. I pass the respective ng-models on the form to the AxleType variable.
  d. I add that AxleType variable to the Truck's AxleTypes collection.

  a: if ($scope.axleTypes == undefined || !($scope.axleTypes.length > 0)) 
       { $scope.axleTypes = API.GetAxleTypes(); }

  b: $scope.axleType = {};

  c: var frontAxle = $scope.axleType;
         frontAxle.Description = $scope.selectedFrontAxle;
         frontAxle.Type = $scope.frontAxleType;

  d: newTruck.AxleTypes = [
        angular.copy(frontAxle)
    ];

デバッグすると、これが最終結果です。

ここに画像の説明を入力

これをできるだけ短くするために、上記の 2 番目の車軸タイプの選択については説明しませんでした。しかし、ご覧のとおり、サーバーは 2 つの車軸タイプを取得していますが、各 [タイプと説明] の両方のプロパティが null です。誰か提案はありますか?

console.log では、両方の値が「未定義」です。

興味深い観察:

TruckCtrl で値をハードコーディングすると、すべて正常に動作します。

    frontAxle.Description = 'Some Front Value';
    frontAxle.Type = 'Front';
    rearAxle.Description = 'Some Rear Value';
    rearAxle.Type = 'Rear';

    newTruck.AxleTypes = [
        angular.copy(frontAxle),
        angular.copy(rearAxle)
    ];

これにより、誰かが問題は車軸テンプレートの ng-model にあると考えるようになります。ただし、サーバー クラスの AxleType ではなく、Description などのプロパティが 1 つしかない場合は、次の方法で選択の説明を追加するだけです。

    newTruck.AxleTypes = [
        angular.copy($scope.selectedFrontAxle),
        angular.copy($scope.selectedRearAxle)
    ];

値が渡されました。非常に紛らわしいです。

4

1 に答える 1

1

解決しました!!!

この問題を入力せずに熟読した 40 人の奇妙な目玉に言いたいことはたくさんあります。しかし、私はしません。代わりに、同じ問題を抱えている人たちに助けを提供します。

OK、解決策に進みます。

問題 #1: Angular は html 入力でデフォルト値を受け入れません。

なぜ私はそのような入力をしたのか混乱しました:

<input ng-model="$parent.selectedRearType" type="hidden" value="Front">

それでもAngularは、価値がないと言いました。

問題の解決策 #1:

コントローラーで以下を初期化する必要があります。

    $scope.selectedFrontType = 'Front';
    $scope.selectedRearType = 'Rear';

問題 #2: コレクション内の複数のプロパティの値をどのように渡すのですか?

このシナリオがどれほど現実的であるかにかかわらず、この問題に関するドキュメントがゼロであることは不安です。

問題の解決策 #2:

私のhtmlには、次のselectステートメントがありました。

  <select ng-model="$parent.selectedFrontAxle" ng-options="axleType.Description for axleType in axleTypes">

私が間違っていたのは、この ng-model が厳密にクラス AxleType の Description プロパティであると考えていことです (上記のクラス モデルを参照してください)。それは大きな間違いでした。その ng-model はクラスの Description プロパティではなく、実際にはクラス全体でした。したがって、select の ng-model を調べるときは、Description プロパティのみが提供されている場合でも、全体が AxleType クラスであることを認識してください。ng-model が私に与えていたのは、ユーザーが選択した後のコントローラーの戻り値としてこれでした:

AxleType class => Description = "人が選択したものは何でも", Type=""

そのため、angular になかった空白、つまりこのシナリオでは Type プロパティを埋める必要がありました。

ソリューション全体は次のとおりです。

    // beginning of controller when it initializes
    $scope.selectedFrontType = 'Front';
    $scope.selectedRearType = 'Rear';    

   // $scope.axleType = {}; -> NOT NEEDED

    // in the save method    
    // axles
    var frontAxle = $scope.selectedFrontAxle;
    frontAxle.Type = $scope.selectedFrontType;

    var rearAxle = $scope.selectedRearAxle;
    rearAxle.Type = $scope.selectedRearType;

    newTruck.AxleTypes = [
        angular.copy(frontAxle),
        angular.copy(rearAxle)
    ];

ここに画像の説明を入力

私は誰かを助けたことを願っています!

于 2013-03-14T22:48:49.077 に答える