2
私はAngularJSフォーム上に複数のドロップダウンリストを持っています。フォームを送信すると、ドロップダウンリストの1つだけが必要な確認を表示しています。ドロップダウンリストの唯一の違いはソースです。動かないものでは、オブジェクトを使用し、オプションのラベルと値を設定します。ドロップダウンでは、ソースは標準の次元配列です。誰もがオブジェクトソースが機能しない理由を知っていますか？AngularJS Validationがドロップダウンで動作しない
<body ng-controller="MainCtrl">
<form name="myForm" novalidate>
<div style="padding: 10px">
<select name="TrailerType"
ng-options="e as e.EquipmentDesc for e in Equipment"
ng-model="TrailerType"
required>
</select>
<p ng-show="myForm.$submitted">
<span ng-show="myForm.TrailerType.$error.required">Required</span>
</p>
</div>
<div style="padding: 10px">
<select name="Hazmat"
ng-options="h for h in HazmatYN"
ng-model="Hazmat"
required>
</select>
<p ng-show="myForm.$submitted">
<span ng-show="myForm.Hazmat.$error.required">Required</span>
</p>
</div>
<button>Sumbit</button>
</form>
</body>
$scope.Equipment = [
{ 'EquipmentDesc': 'Reefer', 'EquipmentId': 1 },
{ 'EquipmentDesc': 'Van', 'EquipmentId': 2 },
{ 'EquipmentDesc': 'Van or Reefer', 'EquipmentId': 3 },
{ 'EquipmentDesc': 'Flatbed', 'EquipmentId': 4 },
{ 'EquipmentDesc': 'StepDeck', 'EquipmentId': 5 },
{ 'EquipmentDesc': 'Removable Goose Neck', 'EquipmentId': 6 },
{ 'EquipmentDesc': 'Double Drop', 'EquipmentId': 11 },
{ 'EquipmentDesc': 'Tanker', 'EquipmentId': 30 },
{ 'EquipmentDesc': 'Rail/IMDL', 'EquipmentId': 34 }
];
$scope.HazmatYN = ['Yes', 'No'];
$scope.TrailerType = {};
$scope.Hazmat = "";
：それは「
myForm」ワーキングデモでなければなりません。コードを修正し、表示されたコードに初期化を追加しました。問題は、コントローラのデフォルト値が{}に設定されていて、 ""に設定されていないように見えます。なぜこれが問題なのか？ – ddelella
何のデフォルト値ですか？あなたのngモデルをオブジェクトにバインドすることをお勧めします。例えば、TrailerType.val、Hazmat .val、コントローラーでオブジェクトを初期化することを忘れないでください。オブジェクトを使用する方が良い理由は、ここで理解できます。https://stackoverflow.com/questions/18128323/if-you-are-not-using-a-dot-in-your-angularjs-models-you- are-doing-it-wrong – Vivz
これは問題のアイデアを得るための簡単な例です。実際のコードでは、ngModalをオブジェクトに設定しています。私が参照している初期化は、コントローラで発生し、オブジェクトの値を{}に設定します（私が提供したコードを参照）。このようにオブジェクトのデフォルトが設定されている場合、必要なHTMLバリデータは機能しません。それを空の文字列に設定すると、うまく動作します。 {}がうまくいかない理由があるかどうか不思議です。 – ddelella