Set selected value in Select2 using angularjs - angularjs

Question

I have a Drop down in my Anjularjs Application implemented using 'ui.select2'
I had initialized it as below
<input type="text" ng-model="objCas.iProjectId" id=" iprojectid" ui-select2="iProjectIdOption" />
And My Js Implementation is getting data from remote server with pagination and filter
var app = angular.module('CASApp', ['ui.select2', 'checklist-model']);
app.controller('CASController', function ($scope, $http) {
$scope.iProjectIdOption = {
placeholder: "Click to choose the Project...",
allowClear: true,
initSelection: function (element, callback) {
},
ajax: {
url: "/Prj/dummy/Ajaxlist",
quietMillis: 0,
type: "POST",
data: function (term, page) {
return {
q: term,
page: page,
listType: "ProjectDetails"
}; // query params go here
},
results: function (data, page) { // parse the results into the format expected by Select2.
// since we are using custom formatting functions we do not need to alter remote JSON data
var more = (page * 30) < data.total_count; // whether or not there are more results available
return {
results: $.map(data.items, function (item) {
return {
text: item.text,
id: item.id
}
}),
more: more
}
},
cache: true
}
}
}
}
Everything works fine .I am able to use all the features and post the values also. But problem is with setting the already selected values at time of edit
Tried
$Scope.objCas.iProjectId= {"text":"2010 / 256 - / dummytext","id":240}
$Scope.objCas.iProjectId=2;
$scope.iProjectId.selected = {"text":"2010 / 256 - / dummytext","id":240}

Answer 1

Get the select2 element object and apply the following code:
angular.element("#select2_id").select2('data', { "text": "text", "id": [id]});

Answer 2

HTML code: no need of id
<input type="text" ng-model="objCas.iProjectId" ui-select2="iProjectIdOption" />
js code:
use only this for default biniding
$Scope.objCas.iProjectId= {"text":"2010 / 256 - / dummytext","id":240}
example code:
link: http://embed.plnkr.co/K66Pf0/
replace script.js file:
// Code goes here
var myAppModule = angular.module('MyApp', ['ui.select2']);
myAppModule.controller('MyController', function($scope) {
$scope.select2Options = {
initSelection: function (element, callback) {
},
ajax: {
url: "./data.json",
data: function (term, page) {
return {}; // query params go here
},
results: function (data, page) { // parse the results into the format expected by Select2.
// since we are using custom formatting functions we do not need to alter remote JSON data
return {results: data}
}
}
}
console.log("$scope.select2Options-",$scope.select2Options.initSelection);
$scope.testModel={ "id": 4, "text": "Fourth", "color": "red" }
;
});
you can view default selected value in dropdown.