Always have a dot in your ng-model - Broken version

HTML

<script src="https://code.angularjs.org/1.3.1/angular.js"></script>
<div ng-app="testApp">
    <div ng-controller="MyController">Input <b>inside</b> ng-switch: <span ng-switch="show">
     <input ng-switch-when="true" type="text" ng-model="name" />
 </span>

        <br/>
        <br/>Input <b>outside</b> of ng-switch:
        <input type="text" ng-model="name" />
        <br/>
        <br/>Name: <span style="color: red">{{name}}</span>

    </div>
</div>
<br/><br/>

<b>Instruction:</b><br/>First manipulate the <b>second input</b>, all three references are updated as expected. Then edit the first input. This causes the child scope to get a new scope property that hides/shadows the parent scope property of the same name.

JavaScript

angular.module('testApp', [])

    .controller('MyController', function ($scope) {
        $scope.show = true;
        $scope.name = 'John Doe';
})

;