How do I determine with radio button is selected and display html accordingly?

I am trying to implement a different modal view that depends on which radio button is working.  But, the below code is not working correctly.  How am I implementing the radio buttons and the usage incorrectly?

<div class="modal-header">
        <input id="treeRadio" name="treeRadio" type="radio" checked="checked" ng-model="hMode" ng-value="tree" />
        <label for="treeRadio">Tree Mode</label>
        <input id="searchRadio" name="treeRadio" type="radio" ng-model="hMode" ng-value="search" />
        <label for="searchRadio">Search Mode</label>
        <input id="bookmarkRadio" name="treeRadio" type="radio" ng-model="hMode" ng-value="bookmark" />
                 <label for="bookmarkRadio">Search Mode</label>
    </div>
    <!--Tree Mode-->
    <div class="modal-open" style="height: 450px; overflow-y: auto;" ng-if="hMode=='tree'">
               <!--do stuff-->
    </div>
    <!--Search Mode-->
    <div class="modal-open" ng-if="hMode=='search'">
              <!--do stuff-->
    </div>
    <!--Bookmark Mode-->
    <div class="modal-open" ng-if="hMode=='bookmark'">
               <!--do stuff-->
    </div>