Inherit this directive into my directive

[kushal555]

Hello, It would great if it supports inherit into custom defined directive. Let me explain what exactly I want;- Actually, i have defined some directives for the country, state and city dropdown. Now I want to make them searchable by using this directive and I use directive HTML code as a template for the country directive. Below is my country directive :-

app.directive('myCountry', ['$http', '$config', function ($http, $config) {
        return {
            priority: 0,
            restrict: 'E',
            replace: true,
            transclude: true,
            template: '<select ng-selected="true" name="country_id" ng-change="get_states(country_id)" ng-options="country.id as country.country_name for country in countries"></select>',
            controller: function ($scope, $element, $attrs, $transclude) {
                $scope.countryNgModel = $attrs.ngModel;
            },
            link: function (scope, iElement, iAttrs) {
                scope.countries = [{id: null, country_name: "Select country"}];
                scope.state_id = null;
                scope.city_id = null;
                scope.states = [{id: null, state_name: "Select state"}];
                scope.cities = [{id: null, city_name: "Select City"}];

                $http.get($config.api_url + 'get-countries').success(function(data) {
                    scope.countries = scope.countries.concat(data);
                    scope.mycountry = null;
                });

                scope.get_states = function ($key) {
                    scope.state_id = null;
                    scope.city_id = null;
                    scope.states = [{id: null, state_name: "Select state"}];
                    scope.cities = [{id: null, city_name: "Select City"}];
                };

            }
        };
    }]);

So how can I integrate to this in above directive?