ng-init在AngulaJS中不起作用

Question

Check my code:

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>

Output

<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>

I have tried both ng-init to selected my default option. But in my dropdown not populate. Please help me.

Answer 1

You will have to initialise fieldId as string like as-

$scope.fieldId='1';

because angularjs requires string value in ng-model filed in case of dropdown As per your requirement, you have to make conditions.filedId to string using ng-init like as -

<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>

I hope this will help you.