Angular: Empty Fiddle
http://angularjs.org/
HTML
<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="Ctrl">
<div special-select ng-model="currentBusinessStructure" ng-option="item for item in businessStructure">How is your business structured?</div>
scope-businessStructure : {{businessStructure}}
</div>
JavaScript
var myApp = angular.module('myApp',[]);
myApp.controller('Ctrl', ['$scope', function($scope){
$scope.currentBusinessStructure = '';
$scope.businessStructure = ['Monarchy', 'Corporation'];
}]);
myApp.directive('specialSelect', [function(){
return {
restrict: 'A',
transclude: true,
template:
'<label ng-transclude></label> \
<select ng-model="ngModel" ng-options="{{ngOptions}}" class="form-control"> \
</select> \
<br>INSIDE MY DIRECTIVE: {{ngModel}} : {{ngOptions}}',
scope: {
ngOptions: '@ngOption',
ngModel: '='
}
};
}]);