Label value selected in angularJs drop down list - angularjs

Question

I had a label containing value user.Rules e.g . London
<label id="ruleId" for="Rules" ng-model="user.Rules" ng-hide="editmode"
style="width:97%; word-wrap:break-word; overflow-wrap:break-word;">{{user.Rules }}
</label>
After click on edit button a drop down list appears containing the list of states e,g Delhi, Pune, London etc.,
<select class="form-control" name="user.Rules" data-ng-model="user.Rules" ng-options="option for option in nestedList" ng-show="editmode" style="width:100%; ">
<option value="" style="margin-left:25px">-Select Rule-</option>
</select>
I need to set the selected value as the label value of drop down list i.e. London
How can I do that ?

Answer 1

Since there is no sample code and sample data for nestedList is not available, so I assume the data as my own and created this sample.
I consider the $scope.RuleId contains the id from the database. I removed the ng-model="user.Rules" from the label and and based on the $scope.RuleId I find its equivalent value.
HTML Code:
<div ng-controller="MyCntrl">
<label id="ruleId" for="Rules" ng-hide="editmode"
style="width:97%; word-wrap:break-word; overflow-wrap:break-word;">{{selectedLabel}}
</label>
<select class="form-control" name="ruleDetails" data-ng-model="RuleId"
ng-options="option.RuleId as option.Rules for option in nestedList"
ng-show="editmode" style="width: 100%;">
<option value="" style="margin-left:25px">-Select Rule-</option>
</select>
<div style="height: 10px"></div>
<div>
<button ng-click="editButton()">Edit</button>
</div>
</div>
Controller Code:
function MyCntrl($scope) {
$scope.editmode = false;
$scope.RuleId = "001";
$scope.nestedList = [{
"Rules": "London",
"RuleId": "001"
}, {
"Rules": "Delhi",
"RuleId": "002"
}, {
"Rules": "Pune",
"RuleId": "003"
}, {
"Rules": "Mumbai",
"RuleId": "004"
}, {
"Rules": "Chennai",
"RuleId": "005"
}];
angular.forEach($scope.nestedList, function(rule) {
if (rule.RuleId === $scope.RuleId) {
$scope.selectedLabel = rule.Rules;
}
});
$scope.editButton = function() {
$scope.editmode = true;
};
}
The same code is added in the Working Sample for your reference.