ngが-INIT AngulaJS

Question

で働いていない私のコードをチェックしてください：

JSON

var json = '[{"type":"product","id":1,"label":"Size","isRequired":true,"errorMessage":"","enablePrice":true,"description":"","placeholder":"Select Size","defaultValue":"","choices":[{"text":"Size 30","value":"Size 30","isSelected":false,"price":"$100.00"},{"text":"Size 32","value":"Size 32","isSelected":false,"price":"$100.00"},{"text":"Size 34","value":"Size 34","isSelected":false,"price":"$100.00"},{"text":"Size 36","value":"Size 36","isSelected":false,"price":"$100.00"}],"conditionalLogic":"","productField":"","basePrice":"$0.00","pageNumber":1},{"type":"option","id":2,"label":"Select Colors","isRequired":true,"errorMessage":"","inputType":"select","choices":[{"text":"Denim","value":"Denim","isSelected":false,"price":"$0.00"},{"text":"Black","value":"Black","isSelected":false,"price":"$0.00"},{"text":"Brown","value":"Brown","isSelected":false,"price":"$0.00"}],"enablePrice":true,"productField":1,"formId":24,"description":"","allowsPrepopulate":false,"inputMask":false,"inputMaskValue":"","labelPlacement":"","descriptionPlacement":"","subLabelPlacement":"","placeholder":"Select Jean Color","cssClass":"","inputName":"","adminOnly":false,"noDuplicates":false,"defaultValue":"","inputs":"","conditionalLogic":{"actionType":"show","logicType":"any","rules":[{"fieldId":"1","operator":"is","value":"Size 30"},{"fieldId":"3","operator":"is","value":"Regular"}]},"failed_validation":"","multipleFiles":false,"maxFiles":"","calculationFormula":"","calculationRounding":"","enableCalculation":"","disableQuantity":false,"displayAllCategories":false,"useRichTextEditor":false,"pageNumber":1,"displayOnly":""},{"type":"option","id":3,"label":"Select Fit","adminLabel":"","isRequired":true,"size":"medium","errorMessage":"","inputType":"select","choices":[{"text":"Regular","value":"Regular","isSelected":false,"price":"$0.00"},{"text":"Skinny","value":"Skinny","isSelected":false,"price":"$10.00"},{"text":"Fit","value":"Fit","isSelected":false,"price":"$5.00"}],"enablePrice":true,"productField":1,"formId":24,"description":"","allowsPrepopulate":false,"inputMask":false,"inputMaskValue":"","labelPlacement":"","descriptionPlacement":"","subLabelPlacement":"","placeholder":"Select Jean Fit","cssClass":"","inputName":"","adminOnly":false,"noDuplicates":false,"defaultValue":"","inputs":"","conditionalLogic":{"actionType":"show","logicType":"any","rules":[{"fieldId":"1","operator":"is","value":"Size 30"},{"fieldId":"1","operator":"is","value":"Size 32"},{"fieldId":"1","operator":"is","value":"Size 34"},{"fieldId":"1","operator":"is","value":"Size 36"}]},"failed_validation":"","multipleFiles":false,"maxFiles":"","calculationFormula":"","calculationRounding":"","enableCalculation":"","disableQuantity":false,"displayAllCategories":false,"useRichTextEditor":false,"enableChoiceValue":false,"pageNumber":1,"displayOnly":""},{"type":"option","id":4,"label":"Select Rise","adminLabel":"","isRequired":true,"size":"medium","errorMessage":"","inputType":"select","choices":[{"text":"High","value":"High","isSelected":false,"price":"$29.00"},{"text":"Low","value":"Low","isSelected":false,"price":"$0.00"}],"enablePrice":true,"productField":1,"formId":24,"description":"","allowsPrepopulate":false,"inputMask":false,"inputMaskValue":"","labelPlacement":"","descriptionPlacement":"","subLabelPlacement":"","placeholder":"Select Rise","cssClass":"","inputName":"","adminOnly":false,"noDuplicates":false,"defaultValue":"","inputs":"","conditionalLogic":{"actionType":"show","logicType":"any","rules":[{"fieldId":"1","operator":"is","value":"Size 30"},{"fieldId":"1","operator":"is","value":"Size 32"},{"fieldId":"1","operator":"is","value":"Size 34"},{"fieldId":"1","operator":"is","value":"Size 36"}]},"failed_validation":"","multipleFiles":false,"maxFiles":"","calculationFormula":"","calculationRounding":"","enableCalculation":"","disableQuantity":false,"displayAllCategories":false,"useRichTextEditor":false,"enableChoiceValue":false,"pageNumber":1,"displayOnly":""},{"type":"total","id":5,"label":"Total","adminLabel":"Total ","isRequired":false,"size":"medium","errorMessage":"","inputs":null,"formId":24,"description":"","allowsPrepopulate":false,"inputMask":false,"inputMaskValue":"","inputType":"","labelPlacement":"","descriptionPlacement":"","subLabelPlacement":"","placeholder":"","cssClass":"","inputName":"","adminOnly":false,"noDuplicates":false,"defaultValue":"","choices":"","conditionalLogic":{"actionType":"show","logicType":"any","rules":[{"fieldId":"1","operator":"is","value":"Size 30"},{"fieldId":"1","operator":"is","value":"Size 32"},{"fieldId":"1","operator":"is","value":"Size 34"},{"fieldId":"1","operator":"is","value":"Size 36"}]},"failed_validation":"","productField":"","multipleFiles":false,"maxFiles":"","calculationFormula":"","calculationRounding":"","enableCalculation":"","disableQuantity":false,"displayAllCategories":false,"useRichTextEditor":false,"pageNumber":1,"displayOnly":""}]'; 
$scope.attributes = json; 

HTML

<div ng-repeat="conditions in attributes.conditionalLogic.rules"> 
    <select class="form-control" ng-init="option.id = conditions.fieldId" name="conditon_dropdown" ng-model="conditions.fieldId" ng-change="" ng-options="option.id as option.placeholder for option in attributes"></select> 
</div> 

出力

<select ng-options="option.id as option.placeholder for option in attributes" ng-change="" ng-model="conditions.fieldId" name="conditon_dropdown" ng-init="option.id = conditions.fieldId" ng-selected="conditions.fieldId" class="form-control ng-pristine ng-valid ng-not-empty ng-touched"> 
<option value="?" selected="selected"></option> 
<option label="Select Size" value="number:1">Select Size</option> 
<option label="Select Jean Color" value="number:2">Select Jean Color</option> 
<option label="Select Jean Fit" value="number:3">Select Jean Fit</option> 
<option label="Select Rise" value="number:4">Select Rise</option> 
</select> 

私は自分の選択に両方ng-initを試してみましたデフォルトオプション。しかし、私のドロップダウンには人が住んでいません。私を助けてください。

Answer 1

あなたはangularjsがあなたの要件ごとにドロップダウンの場合に提出ng-modelに文字列値を必要とするため、あなたに似ng-initを使用して文字列にconditions.filedIdをしなければなられたまま

$scope.fieldId='1'; 

のような文字列としてfieldIdを初期化する必要があります -

<div ng-repeat="conditions in attributes.conditionalLogic.rules"> 
    <select class="form-control" ng-init="conditions.fieldId=conditions.fieldId.toString()" name="conditon_dropdown" ng-model="conditions.fieldId" ng-change="" ng-options="option.id as option.placeholder for option in attributes"></select> 
</div> 

これがあなたに役立つことを願っています。