 <p>You may need to add ng-model also to your directive to bind the selected value to controller scope.</p> <p>This might be what your are looking at:</p> <pre><code> app.directive('locselect', function () { function link(scope, element, attrs) { scope.ngModel = scope.defaultItem; console.log(scope.items); } var select = { restrict: 'E', templateUrl: 'prp-select.html', replace: true, scope: { items: "=" } } return select; }); </code></pre> <p>and your directive's template (app/search-filters/prp-select.html) should be </p> <pre><code>&lt;select ng-options="item as item.full_name for item in items"&gt; &lt;option value=""&gt;Select State...&lt;/option&gt; &lt;/select&gt; </code></pre> <p>and this is how you would want to use - </p> <pre><code>&lt;locselect ng-model="modSelectedState" items="states"&gt;&lt;/locselect&gt; </code></pre> <p>Check the <a href="http://plnkr.co/edit/XhbwhIBmmuKbkqFlWyRM?p=preview" rel="nofollow">plunkr here</a></p>