angularjs - how to populate select option in angular -
i have dynamically created data. based on creating form. problem option not added to select. wrong in this.
customerb : { rows:3, columns: 2, name: 'customerb', fields: [ {type: "select", name:"teacher_id", label: "teacher" , endpoint: "/teachers", required: true, check:[ { id : "1982", name : "mr bob"}, { id : "18273", name : "mrs katrine"} ]} ], }
html
<div class="rows" ng-repeat="field in customerb"> <div class="columns" ng-repeat="newvalue in field"> <div class="controls" ng-switch="newvalue.type"> <div class="form-group"> <label class="control-label">{{newvalue.label}}</label> <select class="form-control" ng-switch-when="select" ng-model="hiii" ng-required="newvalue.required" ng-options="item.id item.name item in newvalue.check"> </select> </div> </div> </div> </div>
this assumption might wrong think in here ng-repeat="field in customerb"
accessing object property directly without scope variable. need add whatever scope variable name in front of property name.
<div class="rows" ng-repeat="field in obj.customerb">
other code provided work perfectly.
demo
angular.module("app",[]) .controller("ctrl",function($scope){ $scope.obj = { customerb : { rows:3, columns: 2, name: 'customerb', fields: [ {type: "select", name:"teacher_id", label: "teacher" , endpoint: "/teachers", required: true, check:[ { id : "1982", name : "mr bob"}, { id : "18273", name : "mrs katrine"} ]} ], }} })
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app" ng-controller="ctrl"> <div class="rows" ng-repeat="field in obj.customerb"> <div class="columns" ng-repeat="newvalue in field"> <div class="controls" ng-switch="newvalue.type"> <div class="form-group"> <label class="control-label">{{newvalue.label}}</label> <select class="form-control" ng-switch-when="select" ng-model="hiii" ng-required="newvalue.required" ng-options="item.id item.name item in newvalue.check"></select> </div> </div> </div> </div> </div>
Comments
Post a Comment