Edit on
<body ng-app="app">
        <div ng-controller="ctrl">
            Version Which Doesnt work
            <my-son firstname='name' about='about'></my-son>
            <br/><br/><br/>
            Version Which Works
            <my-son firstname='{{name}}' about='{{about}}'></my-son>
        </div>
    </body>
var app = angular.module('app', []);
            app.controller('ctrl', function ($scope) {
                $scope.name = 'Manish';
                $scope.about = {
                    age: 28,
                    lastname: 'Prakash'
                };
            });
            app.directive('mySon', function () {
                return {
                    restrict: 'E',
                    scope: {
                        firstname: '@firstname',
                        my: '@about'

                    },
                    template: '<div>My Name is {{firstname}}</div><div>Age {{my.age}} Lastname {{my.lastname}}  </div>'
                };
            });
Rerun