AngularJS Dropdown Multiselect Options not binding - angularjs

I am using AngularJS Dropdown Multiselect - http://dotansimha.github.io/angularjs-dropdown-multiselect/
the problem I am facing is the option attribute that is not binding to the model
<div style="margin: 5%" checkboxes="true"
ng-dropdown-multiselect="" options="example1data" selected-model="example1model"></div>
For example:
if model is :
$scope.example1model = [];
$scope.example1data = [ {id: 1, label: "David"}, {id: 2, label: "Jhon"}, {id: 3, label: "Danny"} ];
Issue:
the binding for options doesn't seems to work correctly as I am getting only Id(s) rest is working fine, if I check David and John ,the options binding with $scope.example1model show only the id not the label
i.e : [{"id":1},{"id":2}
but what I want is
[
{
"id": 1,
"label": "David"
},
{
"id": 2,
"label": "John"
}
]

Set externalIdProp as empty string
$scope.extraSettings = {
externalIdProp: ''
};
html
<div ng-dropdown-multiselect="" options="options" selected-model="myModel" extra-settings="extraSettings"></div>
Works for me, I'm using ^1.11.8

you can try like below.
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app ="sortApp" ng-controller ="mainController">
<!DOCTYPE html>
<html lang="eng-US">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body>
<select class="multiselect" data-placeholder="Select Products"
ng-model="example1model" ng-options="item as item.label for item in example1data"
multiple="multiple" multiselect-dropdown >
</select>
{{example1model}}
<div style="margin: 5%" checkboxes="true" ng-dropdown-multiselect="" options="example1data" selected-model="example1model"></div>
</body>
</html>
</div>
<script>
angular.module('sortApp', [])
.controller('mainController', function($scope) {
$scope.example1model = [];
$scope.example1data = [ {id: 1, label: "David"}, {id: 2, label: "Jhon"}, {id: 3, label: "Danny"} ];
});
</script>
</body>
</html>

Related

How to highlight selected value in Angularjs multiple dropdown

How can I highlight the previously selected value in a dropdown of type multiple in AngularJS?
I want to highlight val: 1, 2 in my dropdown. Scope variable Fruits contains a JSON array of Id, Name and val contains the set of Ids that need to be highlighted.
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<label>Multiple</label>
<select ng-model="val" ng-options="x as x.Id for x in Fruits" multiple>
</select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.Fruits = [
{
Id: 1,
Name: 'Apple'
},
{
Id: 2,
Name: 'Mango'
},
{
Id: 3,
Name: 'Orange'
}
];
$scope.val = [1,2];
});
</script>
</body>
</html>
Try this one. use track by in the select statement, also if you need to multi select the options, you have to set the array of those objects in the ng-model value instead of the individual ids
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<label>Multiple</label>
<select ng-model="val" ng-options="x as x.Id for x in Fruits track by x.Id" multiple>
</select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope) {
$scope.Fruits = [{Id: 1,Name: 'Apple'},
{Id: 2,Name: 'Mango'},
{Id: 3,Name: 'Orange'}];
$scope.val = [{Id: 1,Name: 'Apple'},
{Id: 2,Name: 'Mango'}];
});
</script>
</body>
</html>
with:
<select ng-model="val" ng-options="x.Id as x.Name for x in Fruits" multiple>
</select>
It should work
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<label>With Name: </label>
<select ng-model="val" ng-options="x.Id as x.Name for x in Fruits" multiple>
</select>
<label>With ID: </label>
<select ng-model="val" ng-options="x.Id as x.Id for x in Fruits" multiple>
</select>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.Fruits = [
{
Id: 1,
Name: 'Apple'
},
{
Id: 2,
Name: 'Mango'
},
{
Id: 3,
Name: 'Orange'
}
];
$scope.val = [1,2];
});
</script>
</body>
</html>

MultiSelect Dropdown with checkbox AngularJS

Is there any tag to create a multi select dropdown with checkboxes without writing the directive in AngularJS ? Thanks.
AngularJS Dropdown Multiselect
// HTML
<div ng-dropdown-multiselect="" options="example8data" selected-
model="example8model" extra-settings="example8settings">
</div>
// JavaScript
$scope.example8model = [];
$scope.example8data = [
{id: 1, label: "David"},
{id: 2, label: "Jhon"},
{id: 3, label: "Danny"}
];
$scope.example8settings = { checkBoxes: true, };
Not as a standard no.
You could create you're own directive or use an excisting one if you don't want to write your own like you stated.
Have a look at AngularJS Dropdown Multiselect, and use the option checkboxes.
You can also manage something like implemented in demo below.
'use strict';
angular.module('multiSelectDemo', [ 'shalotelli-angular-multiselect' ])
.controller('MainCtrl', [ '$scope', function ($scope) {
$scope.multiSelectData = [
{ id: 1, label: 'Option 1' },
{ id: 2, label: 'Option 2'},
{ id: 3, label: 'Option 3' },
{ id: 999, label: 'Other', isOther: true}
];
$scope.selectedItems = [
{ id: 1, label: 'Option 1' }
]
$scope.multiSelectOutput = [];
}]).config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
'self',
'http://*./**',
'https://rawgit.com/**',
'http://rawgit.com/**'
]);
});
<!DOCTYPE html>
<html>
<head>
<link data-require="bootstrap-css#3.2.0" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
<script data-require="jquery#2.1.1" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script data-require="angular.js#1.3.0-beta.5" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
<script src="//rawgit.com/ncapito/angular-multiselect/master/multiselect.js"></script>
<link rel="stylesheet" href="//rawgit.com/ncapito/angular-multiselect/master/styles/multi-select.css" />
<script src="script.js"></script>
</head>
<body ng-app="multiSelectDemo">
<div class="container">
<h1>Shalotelli Angular Multiselect</h1>
<div ng-controller="MainCtrl">
<multi-select
values="multiSelectData"
model="selectedItems"
show-filters="true"
show-other="true"
other-ng-model="other"
other-field="isOther"
other-event="keyup"
value-field="id"
label-field="label"
template-path="http://rawgit.com/ncapito/angular-multiselect/master/views/directives/multi-select.html"></multi-select>
<hr />
<p>Multi Select Data: </p>
<pre>{{multiSelectData}}</pre>
<p></p>
<hr />
<p>Multi Select Output: </p>
<pre>{{selectedItems}}</pre>
<p></p>
</div>
</div>
</body>
</html>
Regards.

how to show different images when selecting the different options in drop down list using ionic ,angular JS

when we selecting the list from dropdown i want to show the different images.If we have option like this Option1, Option2 when selecting the option1 i want show option1.img and selecting the option2 i want show option2.image.
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<script>
angular
.module('myApp', [])
// controller here
.controller('myCtrl', function($scope) {
$scope.selectables = [
{ label: 'A', value: 'C:/Users/sp/OneDrive/Pictures/logo.jpg'},
{ label:'B', value:'C:/Users/sp/OneDrive/Pictures/spt logo.jpg'}
];
// this is the model that's used for the data binding in the select directive
// the default selected item
})
</script>
<div ng-controller="myCtrl">
<select
ng-model="selectedItem"
ng-options="S.value as S.label for S in selectables" ng-change="fun()">
</select>
{{selectedItem}}
<img src='{{selectedItem}}'/>
</div>
</body>
</html>
I am write this code but i am not able to showing the option first. Can you anyone please help me how to do that.
Everything is fine in your code it's just you didn't define your module name
ng-app='myApp' the moment I have added it, it worked !
below is the code snippet.
angular
.module('myApp', [])
.controller('myCtrl', function($scope) {
$scope.selectables = [{
label: 'A',
value: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxISEBUSEBMWFhUWGBUVFhYXGBcYGBoWFxgYFxUXGBcYHSggGR8lGxUVITEhJSorLy4wGB8zODMtNygtLisBCgoKDg0OGxAQGy4lHyUyMC81LS0tLy0vLS8zLy0tLS0vLS0tLS0vLS03LS0tLS0tLS0tLS0tLS0tLS0tLS0tLf/AABEIAKkBKQMBIgACEQEDEQH/xAAcAAABBAMBAAAAAAAAAAAAAAAFAAMEBgECBwj/xABNEAACAQIEAQYICwUGBQQDAAABAgMAEQQFEiExBhMiQVFhBxQyVHGBkZMXI0JSU2KSobHS4hUWotHTM3KzweHwNDVjdIJDRHPCJIPx/8QAGgEBAAMBAQEAAAAAAAAAAAAAAAECAwQFBv/EADARAAICAQIDBQgCAwEAAAAAAAABAhEDEiEEMVETFEFSsQUVYYGRodHwIsEyceFC/9oADAMBAAIRAxEAPwDpFqhY3M4YgS7gW7/9ih3LmZ48KXjYgggeo93X11yqednN3Yse839nZWGXNodUelwPs58StWqly+J0iXlxAG69F9Ove2q17Xtbh/8A2jeBziCUXRxv3j8RtVMzDIwuAjw5tzxVpiOvWbW+6y1QIJmQ3Rip7QSD66jtZRrUi8eBxZdSxt7Px8fj8z0FalaqhyCzFjhHmxMnRUElm2AVSbk224DjVuwuISRFkjYMjAMrKbgg8CDW6dqzzckHCTi/AzalatMJjI5QxjdWCM0bWN9Lr5SnvFCpOWOXK+g4yAMNj0xa/pG1SUDFqVqaXHRGUQh1MhTnQl9zHe2v0XIF62xOLjjKLI4UyNoQH5TWJ0jvsDQG9qVq0w+LjdnRHDNGQrgcVYi4B77EGn7UA3alaouWZpFiDKIW1czI0L9zqBf8fuNMZnyjweHfm8RiI43sG0s1jY3sfuNAEbUrVGyvNsPiVLYeaOUA2JRg1j2G3Cn48VGzvGrAumkut91Dbrf02NCaNrUrUMflRgQxU4qG4Nj0xa/ZfhRZGDAFSCCAQRuCDwIPXUJpkyhKPNERyBcnYDia0imVvJYG3GxB/Cq9yzzTRpgXypN26ujewHrP4VrmmJGDwyxAjnH4kfxN/kK6JYVHEpt7vkhhhLLkWOJY450Y2VlJ7AQacqiy5bNh5sNPqsADqXYW7V77gj2VdhIGTUvArcey4rOUKSfUnIoxm4xdpeI5SqsJNMuETFGZ2YBSyHToKltJFrXvbrqegknkmtK8Yjfm0CaeIAJZrg33PDuqhQJPiVEixm+plZh2WWwO/rFPVW8NO87wMTpdoMQupfnBlXUPWL07gswklaBAxDKrvPbtT4vSfS9z6qAP0qqqzzjCR4gTuXLKukhShDPo3Frk9d71MxOIkw0hBkaVTDLJZ9Ozx24aQLA34UAepVXMFiZtULAzuXZedDR2j0sNypt0Qpt6RUvIOccNLJKzdOVAmwUBXIF9rk7UBC5UH4xP7v8AmaDg0V5VvaVLC/Q/+xpYvLESNwS/OIisW25vWx2jF+J3rz8kXKbo+g4fLGGGCfj+QZqqTlsHOSqhNhxY/VG5+4UVl5Mjp2ZtlUKLjd/lE/VFx99YwmAjhxMi6joWAs5PHpGxItw2BosMk1YnxmOUXoe9ETOygWJlUJrVjpHzb9AnvIoUZqL5th1xDQywsSJm5sKwtp034DsFjWMTlcNkEesEzCG7HywPLZR2A39lJwbk2icOaEIJSu9/l/sEc9WOdPbRTO8mESAx6mZpCthvYWJUbDja3toR4tL9G/2TWUoyi6Z048uPJHUmXTlpFqwUvcL/AI1zjkjlvP4pAR0U+Mf0LwHraw9tdVzuLVh5F7VNc2yfNI8JhJl6QxUl1A0kaR5K9Lh1s3srszJak3yPP9nZJ9hkhD/JtV89r+QWz7LsV48MRdOb8gLqN+bAF9tPG5LVS+U+B5rEEgdGTpj0/KHt39dRcXiHsOm/2m/nU/EY1cRhUiOozp5ICklhw49629YrPUpp/U6exyYMkW3a/wAdlW3gy2YOHTyfxJ7cPKfahb/7U9yZkOXPBA5//ExSo0LE/wBliHUM8RJ4K5N177ii0WUtJlL4ZLB5IXjXVsLldAJt1URxWSJNghhZxcc2iEjqZVADKeogi4NdkVSo+fyS1Tb+JQ5XPiGJiBKrPmrwORsebkmUPv1XG3rroMsOFwuHOpI44I136I0hR2i29VzJuRj/ALPmwmMl1PJM8olQnUGJUpJuBZrrf/OsZtleaz4V8JI2EdXXQZ7yo9vnGMAjVt1G1SUH4yDnyleBy+49HPraneWX/E5b/wB2P8J6czfIp+egxWDeMTxR8yyyA83JGbEqSu6m4uDWuHyjFz4qGfHGFFw+po4YS7XkYadbu4HAE2AHXQGvJH/jMz/7hP8ABSinKjNDhsJJKou9gsS/OlchIl+0R99BYctzCDFYqTDrhnTESCQc5JIrCyKlrKhHUalPlmLxE2FfFiFUgd5WSNnYNIBpg8pRst2b02oCvcn58Pgcwhw8U8cnPxcziArqWGLiJbW4BuC+qRfSBRPEYlIs2xcroXWPAxOVVQzECRydIPE0T5VcnVxGHZYFjjnDLLFJpAtKjBlJIF7Ejf01vgsplGPkxUmjTJhooSoJJ1qzM/EDo77H7qAHcjMOZppsyCrHHiUiEUakE6Eueck07BiTbTva29Ylwry4nM44zZ3hgVTwsTG4G9SshyObBzYhIShwsl5YkJYGOU+UgFrc2TvsduypOU5XPGcRNI8Znm020g82gRbRrvu25JJ2qsldG2KWlN3+2n/QMwmcDD4dUny+aNY1CuVSN4xYWLbNcjr4Va8LIrIrRkFCoKkcNJFxb1UAxcOZSxtEwwqBwVaQGRiARYkIRxt2mjeX4RYYY4lvpjVUF+NlAAv7KiNls2lq/H4Oyt8t8mbEYc82Lypcr2sPlJ6x94oFyaynFTYlZcajARKoGsW1FdkHq4n/AFroRhNY5k1s5txUfBGePI8duPN7FWmgmxGL6aMsKXsSLXA4+tj91WNx0SB2H8Kf5k1jmTSU3Kl0Mkit5Tk5MEQmaSwsxhNguoG4vtqtfe16IYjKwXZ0kkjL21hCLNYWvuDY22uKKcyaXMmqEg1MvjjKOoIESMiqN9jYnvJ6P31HyTCWaaYoUMz3CnZgoFrkdRJubUa5k1nmTQAr9kpzCwXbSpBB2vs2v8aexGBV5FkbeyumnqKva9/ZU7mTWeZNACsLlnNlbSylE8lCRYdQBIF2A7CafwGEWJNCkkanbftdix+81O5k0uZNAVHlTjHinRo2Ktzdri3DUdiDx4VpieUcEhV5IXZ1t0S/xQYfKAvufSKMZ1ycOIdW5zTZdNtN+sm/EdtQP3J/638H6q45xy6npWx7GLJwrxx1vdf7IuK5VajNpVhrQJHw6PlXJ7+kTt2CsyZ/h31XhkHOIqSMGW40jYKCbW9lSf3K/wCt/B+ql+5R+m/g/VUVn6ehfVwS5P1/fAiLykSMRrDANMfAyG7WPlWtwJ7afPKHD88JuakZ+12B0Dr5tb2/CnP3KP0/8H6qX7lH6f8Ag/VSs/T0DlwT/wDT+4FbO5tcjI7KJGLEC3oFj1bADbsqFzzfOb7Tfzqz/uUfp/4P1Uv3KP038H6qzeLK+ZvHiuEjya+n/C30Fzvk1DiBuoDdRFG7UrV6DSezPn4TlB6oumcrm5AztME1dDjqtvb8P98KuuQ8lYMMNlDN1k739Pb+HdR+1K1VjjjHkb5uLy5tpsxSrNqVqucxilWbUrUBilWbUrUBilWbUrUBihEeYySxuqRlJeaLC/AOQQg3+sDx+aaMWrGmgASYm2jmoZblVEjENdRqUPrVvLfckHfYMd+vQ47FhSWRQwa24sjR6Dpct8li4A0d/fcWG1NzQB1KstweIPtH3igKzg8XiGlLgNpcKhfm2Okq89g0Y4G2gNbtG4G4tArEcQUWAt/vc99bUBq7gC5NgOumsJi1kBKHgbUA5WySKVJPxZ2t9bvoPhc0aI3Q7MLf77xUnfi4J5MepPdl751dWm4va9u6t6o0OYlWEl973v20RnzxpGHN3UCx7ye/uo0RPgZp7FopUxgsSJEDD1jsPXT9QcTTTpipUqVCBUqVKgFSpUqAVKlSoDF97ddJWB4VAw//ABc3/wAcP4yVNhiCiyiwuT62Nz95qWqJao3pUqVQQKlSpUB5u8ak+kf7TfzpeNSfSP8Aab+dM1KwWFVw7yMVjjALFRdiWNlVQdrk9vZUpWQ2krY341J9I/2m/nS8ak+kf7TfzqV+yi4DYVueW4BFtLpfrdb7L9YbVvFl0LOIln1TG4GlbxagCdGu9ze3EC1ToZTtYkLxqT6R/tN/Ol41J9I/2m/nTIrIBPAE+iqmg741J9I/2m/nS8ak+kf7Tfzpsxt80+w1rQWPeNSfSP8Aab+dLxqT6R/tN/OmaVAPeNSfSP8Aab+dLxqT6R/tN/OmaVAPeNSfSP8Aab+dLxqT6R/tN/OmaVAO+NSfSP8Aab+dLxqT6R/tN/OmqVAPx4qTUPjH4j5Tdvpr0hXmqPyh6R+NelaA59yu5VCUNBBwB6TEcSp4C/AX66rUGOupBOx3Hc3+9qLeEPL44sQJI2F5Bd0HEEfKt1A1XcPEANT7L1AcWPd3d9daxxcU0fT8PPBDFHs/H1CWElZt2NlHEngP5nuozhcUupUDBdZCgnrJ7e6qvPiiRcDZbWUcADsD/rUcyMTck3/3sKqsOpnQ4xyvTdP9+523L8EIlsNyeJ7TUo0J5LyzNhUOIUq9rb8SPksR1EiicyXUjtBHtFc7VOj5TKmsjTd78wTh8OcV8bIzCM35uNWKjT1OxG5J424AEUzmkTYWJ5Imcx6SHQsWK32DoTuLHiKI5JKGgS2xUBGHzWTosvtFMcqMQEwknWWUoo7WbYD/AD9VXTeqiU3qodwkrGdlJNhFEbd5L3P3D2UQoVG4TErq4SxKqn60ZJK+kh7+o0VqsikgJmuMKLim1ECMRH0dbW9VSMJBLKRLI7IOKxLYADq1nix7RwFC8RiVlXG6d1DQpfqNtINu0XJHqNWcVZ7L9+BeX8V+9EB4oTiSXkLc0CVjQEgNpNi7Ebm5BsOFqWLwZw6mXD3su7xXJVkHlaQfJYDcW42p7IX+K5o+VESjD0Hon0EWNZmyaNiSXl6V7gSyAb8RYHhS6dC6dPkLBuGxMpHAxQEegmS1MnGuIujvI8rxpfgDqbc9yqCfVTmBjC4mRV4LFAB6AZAKiBgoikbyVnmDHqGsuoJ9ZA9dBW/09CSmRra7ySs/W/OMpv3BSAPRatMHLIuJEEjFrI7q/wA5boBqttqBuO+9GKEmcNj1Qb6IX1HqBZksvpsL+uoTbuyE27sLUqVKqGZ5oAJIAFydgBxJ7AKOYTLLRTxTSLGzKkmgfGSKIjqYsi/VJ2vehuV4kRTJIwNhe9uIuCuod4vf1UUyLLHScToeejjV31RkFn2ICMh6QY33uO2tMa3OfPJpc68fmPQGDCExo0zy9FpWSFW6BF+aZSx0ix39PdWMBl2GE0eJimKxWeYK0ZsoTZlLhttJK7W4WqZluZeJSzrLFK4kbnkkVCSysNlbsI3HtqPhcFK+GnUI6tiNc6IBZECsCEJPAvvt9UVtS/50OXU93fOt9t75/QAYvAvGAx0sjHaRDqQnsuOB7jajvIU/HSnsjv8AeKFlBBDLG7q0kugc2p1BNLBtTMNtW1gB20U5Cf2st/o/8xVMarIjbiJN4Jft8hiPlhiRYnmyOsabX9d9q25XYZAYpo1C86uplG2+xv8AxfdU/JsNgJy3NQtqUagjsel99j/rQvEY44vFxLIulA4QJ2C+4PebWq0r01J3fIyhp7W4R06Vv/Ww1guTs8iB7KqngXbTf0CoeY5fLA2mVbE7g8QR3GrFykwscs7c5i0TTYCMq3RFh2bb8aj5lLD4jzRxCzOjBkIBuFPEb91/uqJY0rXT4r0L4+InLS+vhT2+YPwGQTyrrVQqngznSD6KYzPKpcORzq2B4MDdT3X7aLYnARpDEMZiJLlbpGgDaV4739P+XVTuaKoy1dEnOqJeixBBA36JB4Eb1Dxqn1rr/QXES1re03XJ+oGyzJ5sRfm12HFmNl9F+s07jOT08WksoIYhQym6gk2F+zeiHKCUx4XCxRmyMhdrbaj0Tv62J9lAFxThDGHYISCVvsSOFVkoR2fM0xyy5P5Jqr5fYs2YcmmGGi0IglUMZTfiAD19dVMVY84Y/s/Cbn5V/ZVdpmq9vgOF1uL1O936s2j8oekfjXpKdSVIU2JBAPGx6javNsflD0j8a9K1kdRxLMYnjnkGJJaRW6V/lHqJPzbWqLiS+oawQSARcW6J4WHZXYsw5PYeadJpEuyC1uo9moddqgcsuTnjUamKwlTZb7AqeKn8a7I8RF0mejDi42rOUYWTQ1zv1HvU8aN8mcTFBjEMyhkOwY/J1eS/+/8AKrlByFhXCtGelMw/tD1MNxpHUL+2g3JvkU8jasYNKISAnW2/Wepb+2rPLBpl+8QcXudHBpVhFAAA2AFgO4cKzXCeWD8Rld3MkUjRO3labFWttdlO1+/jWq5QCS0rtI5UqGawCgix0qNge/jRKlU6mW1MjYrApJHocXAtY3sQRwII3B76iHKnI0viZCnWOiCR2FwL+y1FKVFJoKTQP/ZMel0Xoq/Niw4AJawHsohSpUshtshYzLVdtYZo5ALa0NiR2MDsw9NTEFgBe/fWaVLFsh4vAB3EgZkcbalI3W99LAixH86cTBroaMjUrFiQevUSSPvqRSpbFsFrlTqNMeIkVOpbKxA7AzC/tvUjCZckenRfYNck3LFiCWYncnoiplKmpkuTYqVKlUFTzRU/LkJgxIjvr+JPRvq0K92tbfY2vUCtopGVgyMVYcCpIPtFSnTKzjaosmT4qSOMDGSuiFg0Op3DlusMBc81wuTw6qj4VcWccjYjXbUXY3YxBNJuVPk6bUCkYsSzEsx4kkk+01ss7hObDtoPFNR0+zhWnacvgY9hze2/7sNKB1cOr0UZ5NZmmHd2k1WZCo0i+9+vehFKqRk4u0a5IKcXF8h7AYpoZFkTipv6R1g9xFT8+x0Ukwmw+pWNiwIAs44MCDv/AKUKpUUnVEPHFy1+PIsWKzDCYqz4jXFKAAzINQa3dY0NzWTDFVTDI+19Ujndr9VqH0qmWRvmisMCg1TdLwvYsOJx+FxKIcQ0kcqKFJVdQYD8P9aZx+YwHCDDwiQWk1Xe243uSRwO/CglKpeRsquGiq3dJ3XgHsFmsDwDD4sNZP7ORN2Udn+XXTGPkwaxGPDq7uSDzj7Wt1AbfhQilUdo6olYIqVpvrV7FhgzDCyYWOLEmRWiJtoF9V723ttx67cKr1KlUSk5cy+PEoXXibR+UPSPxr0rXmipP7wYzzvEe+l/NWUp6TswcO8t0+R6OpV5x/eDGed4j30v5qyvKDGed4j30v5qp2y6HQvZ8vMejaVedf2/jPOsR76X81L9v4zzrEe+l/NTtl0Le7ZeY9FUq87ft/GedYj30n5qyM+xnnWI99L+ao7ddCfdkvMeiKVeeRnuL86xHvpfzVsM8xfnWI99J+ao7wuhZeypeZHoSlXn0Z3i/OsR76T81bDO8X51iPfSfmqO8roWXsifmX0PQFKuAHPMV51P76T81IZ3i/OsR76T81O8roT7nn5l9Dv9KuBDOsV51iPfSfmrYZ1ivOZ/fSfmqO9LoT7mn5l9DvdKuCDOcV5ziPfSfmrb9sYrzmf30n5qjva6E+5p+dfQ7zSrhSZvivOZ/fSfmpwZxivOZ/eyfmqO+R6E+5Z+dfQ7jSriAzfE+cT+9k/NS/a+J84n97J+aq99j0I9yz86+hYvgoPnY91+ul8FB87Huv1102lXceKcy+Cg+dj3X66XwUHzse6/XXTaVAcy+Cg+dj3X66XwUHzse6/XXTaVAcy+Cg+dj3X66XwUHzse6/XXTaVAcy+Cg+dj3X66XwUHzse6/XXTTTazDcHYjiO7t7xQUc2+Cg+dj3X66XwUHzse6/XXTAwPCs0BzL4Jz52PdfrpfBQfOx7r9ddNpUBzH4KD52PdfrpfBQfOx7r9ddOpUBy6XwVlVLeNDYE/2XYL/PrmeHiZ2VEBZmIVVHEk7ACvS+L/ALN/7rfga4v4I8Mr5iCwvzcTuv8AeuqX9jmssitpHfwc9EJy6FmyPwXwJGHxzlntcqraEXu1cSe/ao/K3wbRRwNPgi10Us0bHUGUC50nje29t70G8MOYytjRAxIiREZV6mLC7Pbr36PdY1fuTGGkgyaNWDPJzLFU67yXMcYvw8pR3UqL2oh5Msanq5+BxfKsBJiZVhgXU78OwDrYnqA6zV05Y8isPgsCsnOsZ9SruRpcnygq9Vhc8ererZyeyfD5Ng2mxDDnCBzrje56oo+0X9vH0UrDYXE59ipJGcRRxCyggsEDE6VABF2NiSb9XoFU0JL4nR3mU56k6ivuUwVutdCw/gnl0EyYlVffSAhK26rsSDv3Da/XVKgyqZ8ScKiXlDtHpHapIY37BYm/ZWUoNHdj4jHO6fIi1sK6HD4KX0XfEqH7BGSoPZcsCfTaqhPyexCYvxPReW4sB5JU7hwfm23v1WNVljkvAvi4rFNunyBwrYV0BPBa/N3OJXnLcNB037NWq/rt6qpsGVSNihhCLSGTmj12N7Me8AXPoqksclzNcXF4p3pfI6FyGwceFy2TGTKCXV33AJ5tQQq/+Ruf/IVy5Tc3ta+9hwHcK67y2wMssMOX4Rdm0lydkSKOwXUe9gLDidJqhZtyRmgxceFjYTPIocaRpsLkHUCTYCxN62ywdJLwOLg88XOU5PeW/wAkAxWwFX+PwYPou2JUP2CMlb9l9Vz6bVT8Rk8yYrxRl+NLKgHUdXksD2W3v6a55YpR5o9HFxmHI2oy5EOtlFHOVXJk4J4kEglaUGwC2OoECwFzcEsLU/nnJOTCLDqkRmmYJpAI0sbdZO4347VWWOavbkWjxWJ6afPl8gPhcK8jBIkZ2PyVBJrV4yrFWBBBsQdiCOIIrq/JHkt4mXZnDu4A2WwUDcgXJvc29gqhctcA0OMbXIrmW8uwtYMSApFzwA49dMmBwhqZz4faEcuZwjy8H1A4FZ01sgre1cjZ32dzqkR+EADMWwc0QRBIYxLrJ6XydS6dgTtx7Ku9cjhyFcbmOZRHZhqaNvmuHFvUeBr6E+GLby25cLgWWNIxLIRqZS2kKvVcgHc9lP8AKjlW2EwkOIWIOZSoKlioGpdXGxvXP885Nyw5c+JxlziZJEXpG5VBcDftNh6rUd8JP/K8J6Y/8OgCX715pa4ypj1j4z9NHuUGa4mGKNsPhTOzHpoGto2vxsevaqpgsJOpRmztCoKkp0dwLEr5fZtXRVYEXHA7igOd4bwgY2SR4o8u1SR+WgkN13tv0O2rBn/KWTC4BMU8A5w82GiZiNJfiNVur0UB5D/84zH0t/iGiHha/wCWn/5I/wAaAjxcrszZQy5USCAQRJsQdwfJq0NIzRpJIDGxUMesxsRuG7Vvsf8AZFDy7BYjmoyM7RBpU6Oj0RYdHyurhXR3s6BkN9rqwsb946iD2UZaDpg4zMpIsQR0mRd9vpYvnDtX/Zfw2Y3IB31cCvAj5y9o7RxX0UKxDhRY3Cr0gV8qI/SR9qdq9XoqOuppAotqYhrKdKSD6aFvkuOsemsdVHd2MZLf9/f3qOcseVkmDmhiigEzTA2GsqdQYKAAFN73oa3L7EQunj2AeCNjbWG1W7dtIv6L3qD4Tuc8fwHNW5zfRq4a+cTTfuvah2cvjMVjIsBmciQqSHBReixIsAG7TuN+Brc8862jAgEcCLg9x4VmtYkCqFHAAAegCwrY1AGcX/Zv/db8DXnfkznT4PER4hBfTsy8NSEWZb9Xb6QK9EYv+zf+634GvMijascrpo9HgYqUZJnYMXn2BzcxYVI2aRnViWSxiRCHk6d+tQV2+dVjzXlEkGNwuENrz67n5oAtH7WuPVVK8DGCQeMYliNS2jF/krbWzHsB2+zVN5W56cRmL4mM7I6iE9ixHoEekgt66nVtZm8CeRwXJepa/DUsomgJYmEq2leoSKeke8lWXj2GjnJlRluSNiGHxjqZrHrd7LCvs0e01I5b4cZhk4njF2CpiEHXw+MX7JbbtFc95VcuZMdDHDzaxIliwVidTAWHULAb7b/dUSdOy+OLyQUOj3OgeDnnY8vlxc7SSvKzygdJmKqLDSu+7EHh2ihfgpw7nFYubEIyznSbOpVgJWdnIDb2JUeyguQ+EyTDYdIDAkgjAVW1lTpHAEWO/fUWfwiYlsYMUoRbJzXNXJVkuW6R4k3PHq9t41R2LdjketVzLDlMOYS52ZJBKkcbyXJ1CPmhcIq/Ja/R4dpNW7BtFJm05Fi8WHgjJ6xreR2Hs0e2qJifCzOyERwRIx4MXLW79Nh+NVbJeUs+GxJxKuGd785rNw4JudVu/gRwpriie75JptqtqRbY8xzDDZnPPJhZ5g3ORhQJNOjUDGVKqy2AUe09dTvB7hJMRmGJxs6FGUkBSCNLycRY79FAB/5VGHhafzVPen8lQH8JkxjmURxh5SSHDHoAqF8m3SIC8SarcU+Zp2eZxa0JNqrvwOjZXnqYyPEDDMFkjZ4wWFxcXEclutTa/qNVfwXxSNiMZJiiWxCskblt2G7lvUSo4bbCqByYz98FOJo7MLFXQmwZT1E9RBsQaIxctpkx0mMQIDJYPFxUqoAUE7G4t5Xp9FO1TpsdznFSjDk1+os+QQY+XOGlmEqRo0urVqEfN2ZURb9FvknbsvR6LCLNnTzbEYaGNP8A9r6z9yMfbVUxXhUnZCI4YkY/KLF7d4Ww++gXJvlbNhJZJARJzu8gc+U1ydWocDufbUa4rYl8PmknKknVJF5jwE2KzozSxusGH2QsCAxXydN+N2ZmuPmihPhHaebGLGscmhNMaMVYI0khF7Nax4qPUaTeFKUsCIIwovca2JPZZrDT7DTGZ+EWaZVVIo47Oj31F76GDAbgWFwKrOWNxasnHjzxyRk4rZVz5Fr5Yc7h8vSDDiV3OmMsgdmCqLuxZdxe1r/Wrm+X4CfEMxRHkI3Y7sR6Sevb7qtfwnSW2w8YPbzjEX7baf8AOh/JblY2F528Yk51tex02fe/Udt+FZ5pY5yW+xfho5sUH/FX/vmB4x1U5ak8pd2c8WZmNuF2JJt7a3tXlye566lsdsodgsjghnkxEaWll8trsb734E2G/ZRGlX0h8YQc4yiHFR81iE1JcNa5G44bqQaazPk/h8REkMyakS2kamFrDSNwbnaidKgKt8HmW+b/AMcn5qs8UYVQo4AAD0DYVtSoAdgMjghmkniTTJLvI12N978CbDfspzN8qhxUXNYhdSXDWuRuOG4INTaVAVb4Pct83/jk/NVkwmGWJFjjFlQBVHGwGw3NO0qAYmwaNuV3BDXGxuNr3Hdt31rhcBHHsigblh12LcdN+HqqTWGNRSLa5VVg/Mciw88sU0qaniN4zqYWNw3AGx3A41rnWQYfF6fGI9WgkqbspF+NipB6h7KICQHh6PZxrOqpKmUWwAHUAN9zt2k8aya11VjX1UBpi/7N/wC634GvMq8BXpuYalK9oI9otXLx4JW87HuT/UrLJFvkd3B5oY71M5rc72JF9jY8R2HtrCiul/BK3nY90f6lL4Jm87Huj/UrPRI7O84evqMcgeXUWFg8XxQfSpJjZRqsG3KkXvxuR6as3wi5Z9f3NAvgnbzse5P9SsfBM3na+6P9SrLtEqo55rhpSctXr+A98IuWfW9zS+ETLPr+5oD8E7edj3R/qVkeCdvO190f6lTeToU0cN5n9/wHvhDyz63uaz8IeWfW9yaAjwUN52PdH+pWR4Km87Huj/UqLydC2jhfO/v+A78IWW/X9yaR8IWWfW9yaBjwVt52PdH+pSPgrbztfdH+pS8nQnRwnnf3/Ac+ELLfre5NZ+EHLfre5NAvgrbzoe6P9Sth4LG86Huj/UqLy9Bo4Tzv7/gN/CDlv1/cmthy/wAt+v7k0D+C5vOh7o/nrdfBgR/7oe6P56hyy9CdHB+d/f8AAa/fzLvre6rP795f2N7qgw8GZ85Huz+eth4NT5yPd/rqurP5f36k6OD87+/4DP785f2N7qqjyuziHFTK0CaQqkFiApYk3Gw6h39pouPBwfOB7v8AXTqeDwj/ANwPdn81Y5VnnGtPp+TTDLhMUtSk/v8AgqES09arevIMj/1x7s/mrb9xT9OPsH81cT4TP5fT8nb3/h/N9n+C70qZxbERuRxCsQe8A2rnGGzXMRh8FifGtRxEgg5to00jUWAkYgAlujfaw4V7x80dNpVQznuJwgzCOWXn2w6xPE7Kqm8o4MFsLAkew1nk/mmL54JI880ckTszyYZoRFIq6hpbSAVO437qAvdKucZfnOOjy1sfLiOc1KI4oyigBzLoErEDc8duHCjscGNw6TtLixMvMO6kqqyJKFJuoUWKbddGC1UqpMGbzmPKSZTec2m2Xp9C++22/ZaouWNmOJXFyJi2URSYmONAiXLLul2I2A2AFqBHQKVU3Kc+lxc2CWNyAYWnxIAG5HxYQ3G3xgY7W4VcqAVatWa1agOJQPjTm2JjwEpRzNiG06rI2liTdSCpPpFWXLvCDiIi0ePw+6X1PEVvt9W5U+pqr2b4N/HMT4vGzyGSY2W+ojUS1u63UKKclc4y1brisO8coFmMqmROG+1uj619dd0sUYr+W76I8+Oacm9OyvmwnByvxOOcx4EJH2lmXWB29L/IGteQcrtjpDKxdhG4JJJ4Oo2Jqv5zl2DxMg/ZcEoe99SE6PSE3K+m627Kf8E8z+PyI5JtE977m4dAd/bUt6cbTjVorFa8qak3T+XyOuUIwWdPKmuPDSFdTqDqhF9DshNi/apowtVfkrDOcKCkyqvOYiwMWoj4+Tr1i/srhR6LDGCzNZHaIo8cqgMUcC+gkgMrKSrC4tsduu1a53nCYWMPIGa5sFQXY2BZyB1hVDMe4UOwOqPH6JyJJZISySjogRxuNUZj4Ju4Oq5vvfgKawE8k+IbFCEyRAGLD9NANF/jZLN89lAB+ao7TU0RZZY3DAMpuCAQRwIPAih37YDMywRvNpJVmXSI1YcV1uQGIOxC3twNC8jeSLncEy6GVHkwoJB+KNwEBG3xbEL6ClTeRjqcBhwvyY1Rx1iVRaUN9bXqvSqF2TsNipGfS8DoPn6o2X0Gzar+qlleYLPHziggapE6Vr3jdkJ2PC6k1MFUfLMvnlwt1KvGs+JPi3kiVefl1K7349i+TtZr32hKw20WrA5kszHmlZkH/q7c2x6whvd7fOAt3mouBzl5o1ljw0hRrkHVCCQCRwL91Tssx0c0YaLgOiVI0sjDijL8kjsoFyTgnOCh0TIos1gYtRHSbr1i9SAzgMzWV2j0vHIgVmjcANpa4VgVJVgSpFwTwpo5wGdkgiebQSrMulY1YcV1uQGI6wt7ddqgYBXTGSRykPPJAHWYbDQjFRGY+CWZ7jc6rm52p7kQR4hAvykXRIOsTKSJQ3fr1H10aCZIkzjmyPGIniUkDnCUaMEmwDMhJTfrIA762zrOUw3NmRXIkYrdRfSArOWYcdICkm16XKOSNcHOZfI5twRxvdSAoHWSSAB2mhMiOv7KWXywwD/3hhJQ1/XRINtFmRwwDKQQQCCNwQeBB7Kh4fMlcTEBviHZGvbcqiuSN+FmHGhzg4Fiw3wjG7DicOx4sP8ApE8R8jj5N7a5UbpjyNwZ5iPQYIrGlCyVg84kljSVMLLpdVdbvCDZhcba++iWGkZlBZCh36JKkj1qSKBcm8PiDg8PpnQDmYrAw3sNAsL696PQKwUByGbrIGkH1XNvbUMlEd8eoxC4ex1NG8oO1rIyKQeu93HsNR4c3MlzBC8iAsvOXRFLKSrBdRubEEXtbsJqPiP+aQ/9rP8A4sNPRZS8NxhZtCks3NSJziAsSzaSCrrckm1yB1CmxFsnYSdnB1xNGQbWYob94KMdvTapF6GZXmTPLLBKgWWIIzaSWRlk1aGBIBHkNdSNu00UoyUKaPUrL84Ee0WoCnJOMYfCwc49sLIsqtZbsVLGzbWt0uqrDSqCQLLyaieXEySFmGKRI3TYABBYFSN79fqprKeTPMsWbFYiWyGJBIw0qn91QAx7zR+lQATDcmYlwPiLlnjsVubBt2LA7bAgn7qZy3kmkbs8s0s7tGYQ0pHRiPFRpA9tWGlQFVwHIlIngbxiZxh2LRK5UqqkeQAB9/HYUSy7LlwUUxTXLqklnKgDUS25RALX4bUYpGgKjyByhovGJ3iaIzSMUR/KWIElQR1bsdvRVupUjQGKw1ZrDUBzQZLjHxs0mHBjvJKBIeiLFiDYnc7dYFGsHyEiN2xcjzM177lRv331H03FXA1iumfFTey2OWHCY4u3uc7xXg8mgcy5Zinibjocmx7ta8R3Mp9NQ/B1kmKw2YyHFRMpaJzq2KsS6E2Zej2m1dQNZrHW6o27NXaMULgyONBpjeZVuzWWVwLsxZrC+25J9dExWaoaA5clhCyLZryqUdy7mQrvtzhOoDc8Dtep0EKoqogAVQFUDgABYAeqt6QoCNicCkjxuw6URLIwJBFwVYbcQQeB22HZTE2TxM5kXVG7eU0bsmo8LuFNmPDcgmiFIUsURcLggjatcjG1unIzD7PDq42rbA4NIU0Riy6na1yd3Yu3H6zGpFKgojLgUExmUEOw0sQSAwHDUvAkdR49VRMPkUcahI3mVRwUTSAC5vtv30UFKpsiiJgsujiLFF6TW1OzM7ta9gXYkkC5sL7XpufKImcyDUjnymjdkLW2GsKbNt2g1PpVFigemTxBw765GU3UyOzhT2qpOkHvtepGIwaO0buLmJi6bnZirIeHHosafpClk0IioOX5RDBG8cK6UdmZluSLsApAv5IsAABsLVPrFADIMjjRFRJJwqgKoE0lgALAceynMXl4MQX419DCRRzrKzMpuAXvuO47UQpGpsigPh8LK+LGIlQRhImiRdQZiXdWZmtsoGgAAE8TUj9kjqlnA7Oec/eST99EKVLFEXAZfHCCI1sWOpmJLMx4XZ2JLG225qVSpVBJ/9k='
}, {
label: 'B',
value: 'data:image/png;base64,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'
}];
})
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app='myApp' ng-controller="myCtrl">
<select ng-model="selectedItem" ng-options="S.value as S.label for S in selectables" ng-change="fun()">
</select>
<img ng-src='{{selectedItem}}'/>
</div>
</body>
</html>
<select
ng-model="selectedItem"
ng-options="S.value as S.label for S in selectables" ng-change="fun()">
</select>
{{selectedItem}}
<img src='{{selectedItem}}'/>
DEMO
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<script>
angular
.module('myApp', [])
.controller('myCtrl', function($scope) {
$scope.selectables = [{
label: '',
value: 'C:/Users/sp/Pictures/111.png'
}, {
label: 'CR00-1511-003352',
value: 'C:/Users/sp/Pictures/222.png'
},{
label: 'ED05-1511-003353',
value: 'C:/Users/sp/Pictures/333.png'
},{
label: 'ED05-1511-003356',
value: 'C:/Users/sp/Pictures/444.png'
},{
label: 'ED05-1511-003360',
value: 'C:/Users/sp/Pictures/666.png'
}, {
label: 'HL01-1511-003364',
value: 'C:/Users/sp/Pictures/777.png'
}];
})
</script>
<div ng-app='myApp' ng-controller="myCtrl">
<select ng-model="selectedItem" ng-options="S.value as S.label for S in selectables" ng-change="fun()">
</select>
<br><br><br>
<img src='{{selectedItem}}'/>
</div>
</body>
</html>

get array values based on checkbox

I have a situation where there are 3 check box ("initially checked"). Since it as 3 check box it will use ng-repeat for 3 time and loops the division for there time. Now once i uncheck any of the check box it should display div for 2 time. So far ,
$scope.items = [
{id: 0, title: "apple",selected:true},
{id: 1, title: "orange",selected:true},
{id: 2, title: "grapes",selected:true},
];
On ng-click in each check box i have called a function test("apple").
$scope.test = function(vals) {
$scope.vl=[];
for(var i=0;i<$scope.items.length;i++) {
if($scope.items[i].title == vals) {
console.log("dnt push");
}
else {
$scope.vl.push({
id: $scope.items[i].id,
title: $scope.items[i].title,
selected:true
});
}
}
console.log("vl array");
console.log($scope.vl);
}
Problem I am facing is it works fine for 1st uncheck but not when i do for multiple uncheck. When i check unchecked its not loading div.
In HTML I am using like,
<div ng-repeat="item in vl"> some tags </div>
not quite sure about your question, but hope my answer can give you some hints.
plunker demo
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
$scope.items = [{
id: 0,
title: "apple",
selected: true
}, {
id: 1,
title: "orange",
selected: true
}, {
id: 2,
title: "grapes",
selected: true
}];
});
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>
document.write('<base href="' + document.location + '" />');
</script>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js#1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<p>Hello {{name}}!</p>
<div ng-repeat="item in items">
<input type="checkbox" ng-model="item.selected">{{item.title}}
</div>
{{items | json}}
</body>
</html>
If and only if you want to put in an array the item who are checked :
http://plnkr.co/edit/DvoPBBvKf3AhYM4qcBhx?p=preview
html
<div ng-repeat="item in items">
<input type="checkbox"
ng-model="item.selected" ng-click="test(item.title)"> {{item.title}}
</div>
controller
$scope.test = function(vals) {
$scope.vl=[];
$scope.vlChecked=[];
for(var i=0;i<$scope.items.length;i++) {
if($scope.items[i].selected) {
$scope.vlChecked.push({
id: $scope.items[i].id,
title: $scope.items[i].title,
selected:true
});
}
}
console.log("vlChecked array");
console.log(JSON.stringify($scope.vlChecked));
}

How to select option in Angular JS with object?

There is object:
$scope.type = {
1 : 'Inside',
2 : 'Outside'
};
HTML ng-options:
<select ng-options="key as value for (key , value) in type" ng-model="selectedType"></select>
I tried:
$scope.selectedType = (UserGlobalService.type == 1) ? $scope.records[1] : $scope.records[2];
Hi this would solve your problem
Index.html
<html lang="en" ng-app='myApp'>
<head>
<title>My AngularJS App</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.min.js"></script>
<!-- Modules -->
<script src="app.js"></script>
</head>
<body ng-controller ='MainController'>
<div>
<select class="form-control" >
<!-- <option ng-value= "{{item}}" >{{item}}</option> -->
<option ng-repeat="option in type" value="{{option.value}}" ng-selected="type.value == option.value">{{option.value}}
</option>
</select>
</div>
</body>
And your JS should be like this.
var myApp = angular.module('myApp', []);
myApp.controller('MainController', ['$scope',
function($scope) {
$scope.type = [{
"id" : 1,
"value" : "Inside"
},{
"id" : 2,
"value" : "Outside"
}];
}
])
I Edited my answer a bit
This is how I would do it:
$scope.types = [
{ id: 1, name: 'Inside' },
{ id: 2, name: 'Outside' }];
$scope.selectedType = $scope.type[0];
HTML:
<select ng-options="t.name for t in types" ng-model="selectedType"></select>
Here's Plunker: http://plnkr.co/edit/uyP5EeOUTQb7n1ymsFuB

Resources