Dropdown directive

dropdown.directive.js

/**
 * States dropdown directive
 * 
 */

app.directive('stateDropdown', function(){
    return {
        controller: function($scope, stateService) {

            stateService.list()
            .success(function(data, status, headers) {

                $scope.states = data.states;

                alert($scope.state);

            })
            .error(function(){

            });


        },
        scope: {
                state: '@'
            },
        restrict: 'A',
        templateUrl: 'components/states/template/dropdown.html',
    };
});

dropdown.html

<div class="field-box">
    <label>Estado:</label>
    <select ng-if="states" class="span12" ng-model="state"
    ng-options="o.title for o in states">
    </select>
</div>

form.html

 <div class="span3">
    <div state-dropdown data-state='{{user.identity_data.city.state}}'></div>
</div>

service.js

/**
 * States service
 * 
 */

app.factory('stateService',
    function($http, authentication) {

    var requestAll = function() {
      return $http({
        method: 'GET',
        headers: {'X-WSSE': authentication.getWSSE()},
        url: app_config.api_url + "api/states?_format=json&_username=" + authentication.getUser().username + "&_hash_password=" + authentication.getUser().password
      });
    };

    return {
        list: function(username) {
            return requestAll();
        }
    };

});