指令中的Angular Controller不绑定

Question

刚接触过角度，似乎停留在最简单的任务上。 我有需要修改的现有应用程序。 我正在尝试向页面添加其他选项卡-该选项卡显示但我模板中的内容不显示-它也不会触发控制器中的consols.log

指示：

'use strict';

angular.module('bdrApp.admin.student-transfer-directive', [])
/* bdr-student-transfer
 */
.directive('bdrStudentTransfer', [function() {
    var controller = [
        function() {
            console.log("Hello, Student Transfer");
        }
    ];

    return {
        scope: {},
        restrict: 'E',
        controller: controller,
        templateUrl: 'res/templates/admin/studentTransfer.html?v1.0'
    };
}]);

模板：

<div  class="studentTransfer" ng-show="!loading">
    <div class="">
        <strong>Coming Soon!</strong>
    </div>


</div>

app.js

  'bdrApp.admin.student-report-directive',

index.html

    <script src="directives/admin/student-transfer-directive.js"></script>

adminview.html（定义选项卡的位置）

    <div ng-switch-when="resource" class="admin-resource-view">
            <bdr-admin-resource-view ></bdr-admin-resource-view>
        </div>
        <div ng-switch-when="studentTransfer" class="admin-studentTransfer-view">
            <bdr-student-transfer></bdr-student-transfer>
        </div>

Answer 1

我按照橙色的建议解决了问题，删除了ng-switch-when标签以进行故障排除。 这在所有选项卡上显示了我的模板内容，并触发了console.log。 然后，我这次不使用camelCase放回标签，而是将其全部保留为小写-可以！

如果有人可以评论为什么这是区分大小写的，那就太好了。

谢谢

adminView.html：

 "<div ng-switch-when="studenttransfer" class="admin-studentTransfer-view">"

adminView.js

   // Define tabs
  $scope.tabs = {
    students: {
      text: 'Manage Students',
      active: true,
    },
    teams: {
      text: 'Manage Teams',
    },
    scheduler: {
      text: 'Scheduler',
    },
    reports: {
      text: 'Reports',
      active: true
    },
    resource: {
      text: 'Resources',
      active: true
    }  ,
      studenttransfer: {
          text: 'Student Transfer',
          active: true
      }
  };