Expression in attribute value not evaluated AngularJS

Question

app.directive("widget", function () {
    return {
        restrict : 'E',
        templateUrl: function (elem, attr) {
            return '/Views/Widget/' + attr.widgettype + '.html';
        },

        controller: function ($scope, $element, dataService) {
            console.log($scope.w.DataUrl);
            dataService.getData($scope.w.DataUrl)
                .then(function (data) {
                        $scope.DataSource = data;

                        $('#' + $scope.w.Name).kendoGrid({
                            columns: PrepareColumns($scope.w.Columns),
                            dataSource: data,
                            scrollable: true,
                            sortable: true
                        });
            });
       },       
    }
});

<div ng-app="WidgetContainer" ng-controller="WidgetContainerCtl">
    <widget ng-repeat="w in UserWidgets" class="panel panel-default" widgettype="{{w.WType}}"></widget>
</div>

Above is the code through which I am trying to achieve

1) Iterate an generate widget tags based on the collection passed. 2) Use the widgettype attribute value to determine the template required.

But the above does not fetch the value for widgettype at following line

return '/Views/Widget/' + attr.widgettype + '.html';

I have already tried using nr-attr-widgettype but that too doesnot work.