new to angular and appear to be stuck on the simplest of tasks. I have and existing application that I need to modify. I'm trying to add an additional tab to a page - the tab shows up but the content from my template does not - it also does not fire a consols.log I have in the controller
Directive:
'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'
};
}]);
Template:
<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 (where the tabs are defined)
<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>
I solved the problem following the suggestion from orange to remove the ng-switch-when tag for troubleshooting. This showed my template content on all the tabs and fired the console.log. I then put the tag back in this time not using camelCase and keeping it all lower case - works!
If someone could comment as to why this is case sensitive that would be great.
Thanks
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
}
};
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.