After much searching, I have finally discovered the solution for filtering and listing values based on conditions in my demo.js file.
'use strict';
var app = angular.module('demo', ['ngSanitize', 'ui.select']);
app.controller('DemoCtrl', function ($scope, $http, $timeout, $interval) {
$scope.oldArray = [];
$scope.people = [
{ name: 'Niraj'},
{ name: 'Shivam'},
{ name: 'Arun'},
{ name: 'Mohit'},
{ name: 'Koushik'},
{ name: 'KedaBro'},
{ name: 'Tripathi'},
{ name: 'Nlma'},
{ name: 'Nshma'},
{ name: 'BsCoder'}
];
var people = $scope.people;
var oldArray = [];
var array = "Niraj,Shivam";
array = array.split(",");
for(var i=0 ; i < array.length ; i++){
oldArray.push({
name : array[i]
});
}
var filteredArray = people.filter(function(itm){
return array.indexOf(itm.name) < 0;
});
$scope.filteredArray = filteredArray;
console.log(filteredArray);
$scope.multipleDemo = {};
$scope.multipleDemo.selectedPeople = [];
for(var i = 0 ; i < array.length ; i++){
$scope.multipleDemo.selectedPeople.push({name : array[i]});
}
$scope.submitValue = function(){
console.log($scope.multipleDemo.selectedPeople);
}
});
This is my html file
<!DOCTYPE html>
<html lang="en" ng-app="demo">
<head>
<meta charset="utf-8">
<title>AngularJS ui-select</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-sanitize.js"></script>
<!-- ui-select files -->
<script src="./select.js"></script>
<link rel="stylesheet" href="./select.css">
<script src="./demo.js"></script>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.css">
</head>
<body class="ng-cloak" ng-controller="DemoCtrl as ctrl">
<h1>Multiple Selection</h1>
<ui-select multiple ng-model="multipleDemo.selectedPeople" theme="bootstrap" ng-disabled="ctrl.disabled" sortable="true" close-on-select="false" style="width: 500px;">
<ui-select-match placeholder="Select person...">{{$item.name}}</ui-select-match>
<ui-select-choices repeat="person in filteredArray">
<div ng-bind-html="person.name"></div>
</ui-select-choices>
</ui-select>
<button name="button" ng-click="submitValue()">Click me</button>
</body>
</html>
Link to Plnkr