显示/隐藏<tr>根据下拉选择-angularjs

我的controller中有以下objects的array：

$scope.reportsValuesOptions = [  
   {  
      "value":"Cash Position Report",
      "option":"Cash Position Report"
   },
   {  
      "value":"Detail Report",
      "option":"Detail Report"
   },
   {  
      "value":"Reconciliation Report",
      "option":"Reconciliation Report"
   },
   {  
      "value":"Summary Report",
      "option":"Summary Report"
   },
   {  
      "value":"Sweep Report",
      "option":"Sweep Report"
   },
   {  
      "value":"FCCS/FBPS Detail Report",
      "option":"FCCS/FBPS Detail Report"
   },
   {  
      "value":"CustomReport",
      "option":"Custom Report Name"
   }
];

这是我的dropdown，它是基于上面的array:填充的

<select name="rname" id="rname" ng-model="rname" ng-options="report.option for report in reportsValuesOptions track by report.value">
    <option value="">---Select---</option>
</select>

这是我想根据上面的下拉值显示的行

<tr ng-if="rname === CustomReport">
    <td class="label-cell">* Custom account Number(s) :</td>
    <td>
        <input type="text" id="custaccountNumber" name="custaccountNumber" ng-model="custaccountNumber" />
    </td>
</tr>

只有当我的下拉值更改为'CustomReport' 时，我才想显示<tr>

完整示例

当我运行html时，会显示<tr>，一旦我选择ANY选项，它就会隐藏起来。我希望<tr>被默认隐藏，并在从下拉列表中选择'CustomReport'值选项时显示ONLY。它应该在选择任何其他选项时隐藏。