<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app="test">
<div ng-controller="DemoCtrl">
<select ng-model="selectedRole" ng-options="Role as Role.Name for Role in Roles track by Role.Id" ng-change="GetValue()">
@*ng-options="Role as Role.Name for Role in Roles"*@
@*ng-options="a.Id as a.Name for a in Roles track by a.Id"*@
<option value="">Select Account</option>
</select>
<br />
@*selected Value is : {{selectedRole}}*@
</div>
</div>
<script>
angular.module('test', []).controller('DemoCtrl', function ($scope, $http, $window) {
$scope.selectedRole = null;
$scope.Roles = [];
$scope.GetValue = function () {
var RoleId = $scope.selectedRole.Id;
var RoleName = $scope.selectedRole.Name;
console.log(RoleId, RoleName);
}
$http({
method: 'GET',
url: '/Account/GetRoles',
}).success(function (result) {
$scope.Roles = result;
console.log($scope.Roles);
});
});
</script>