The city directive $parent is a transcluded scope of state directive.
The transcluded scope of the state directive is inherit for $parent of state directive which is controller thus that is why $parent.MyName = India.
The $parent of transcluded scope is the state directive isolated scope ( scope = {} ) that is why $parent.$parent.MyName = Tamilnadu ( Part of Angular 1.3 update )

Bit of detail of what happen :
How to access parent scope from within a custom directive *with own scope* in AngularJS?
transclude: true – the directive creates a new “transcluded” child
scope, which prototypically inherits from the parent scope. If the
directive also creates an isolate scope, the transcluded and the
isolate scopes are siblings. The $parent property of each scope
references the same parent scope.Angular v1.3 update: If the directive also creates an isolate scope,
the transcluded scope is now a child of the isolate scope. The
transcluded and isolate scopes are no longer siblings. The $parent
property of the transcluded scope now references the isolate scope.
Also Matthew’s answer is correct for parent-child directive communications.