Angular JS - Update input options with other input options
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<div ng-controller="myCtrl" ng-app="myApp">
<div>
<select>
<option ng-click="changeShipping(30); shippingCountry='Freedonia'">Freedonia</option>
<option ng-click="changeShipping(70); shippingCountry='Mordor'">Mordor</option>
<option ng-click="changeShipping(100); shippingCountry='Oz'">Oz</option>
</select> Displayed option should be the same as in the second input
</div>
<div>
<select>
<option ng-click="changeShipping(30); shippingCountry='Freedonia'">Freedonia</option>
<option ng-click="changeShipping(70); shippingCountry='Mordor'">Mordor</option>
<option ng-click="changeShipping(100); shippingCountry='Oz'">Oz</option>
</select> Displayed option should be the same as in the first input
</div>
</div>
JavaScript
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.selectedCountry = [{
"country": "Freedonia",
"country": "Mordor",
"country": "Oz"
}];
//Bit required for ng-Cart directive
$scope.changeShipping = function(amount) {
ngCart.setShipping (amount);
};
});