Angular: Empty Fiddle
http://angularjs.org/
HTML
<div ng-app="DispAngleApp" ng-controller="AppCtrl as app">
<p><span class="alfa">α = {{angle1}}°</span></p>
<input type = "text"
id = "ang_1"
maxlength = "3"
onfocus = "this.value = parseInt(value) || ''"
onblur = "this.value = parseInt(value) || '0'"
ng-change = "minmax(angle1, 0, 360) || 0"
ng-model = "angle1"
ng-init = "angle1='0'" ><br>
<p><span class = "beta">β = {{angle2}}°</span></p>
<input type = "text"
id = "ang_2"
maxlength = "3"
onfocus = "this.value = parseInt(value) || ''"
onblur = "this.value = parseInt(value) || '0'"
ng-change = "minmax2(angle2, 0, 360) || 0"
ng-model = "angle2"
ng-init = "angle2='0'"><br>
<p><select size="1" ng-change = "change_val(angle3)" ng-model = "angle3">
<option ng-repeat ="option in data" value="['{{option.corner1}}', '{{option.corner2}}']">{{option.name}}</option>
</select></p>
</div>
JavaScript
var myApp = angular.module('myApp',[]);
function AppCtrl($scope) {
$scope.change_val = function (value){
var va = value;
va = va.replace(/^\[\'|\'\]$/g,'').split("', '");
$scope.angle1 = va[0];
$scope.angle2 = va[1];
}
$scope.data = [
{id:0, corner1: '0', corner2: '0', name: '---Choose TC---'},
{id:1, corner1: '0', corner2: '0', name: 'TC-6(01)'},
{id:2, corner1: '90', corner2: '99', name: 'TC-6(02)'},
{id:3, corner1: '180', corner2: '270', name: 'TC-6(03)'}
];
}
function change_val(el){
var ang_1 = document.getElementById("ang_1");
var ang_2 = document.getElementById("ang_2");
var v = el.value;
v = v.replace(/^\[\'|\'\]$/g,'').split("', '");
ang_1.value = v[0];
ang_2.value = v[1];
}