Could someone help me figure out why the Land selection is empty when trying to display it as {{ selectCenter.land }}?
For reference, here is a functional plunker:
http://plnkr.co/edit/Q8jhdJltlh14oBBLeHJ9?p=preview
And the relevant code snippet:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<link rel="stylesheet" href="style.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<h1>ngOption demo</h1>
<div ng-controller="SelectCtrl">
Search: <input ng-model="searchText" type="text">
<select
ng-model="selectCenter"
ng-options="center.land for center in centre | filter:searchText"
multiple class="form-control input-lg">
</select>
You have chosen:
{{ selectCenter }}
</div>
</body>
</html>
// Code goes here
angular.module("myApp", []);
angular.module("myApp").controller("SelectCtrl", ["$scope", function ($scope) {
$scope.centre = [
{"id":"122","shopID":"200","land":"denmark"},
{"id":"123","shopID":"201","land":"france"},
{"id":"124","shopID":"202","land":"italy"}
];
}]);