create a function to get TermCodes

src/app/degree-planner/degree-planner.component.html

@@ -46,6 +46,7 @@
 									*ngFor="let term of termsByAcademicYear[year.key].terms | keyvalue" 
 									[term]="termsByAcademicYear[year.key].terms[term.key]" 
 									[courses]="getCoursesByTerm(year.key + term.key)" 
+									[termCodes]="getTermCodes()"
 									fxFlex="33%"
 								></cse-term-container>
 							</div>

src/app/degree-planner/degree-planner.component.ts

@@ -72,4 +72,14 @@ export class DegreePlannerComponent {
 			}
 		}
 	}
+
+	getTermCodes() {
+		if (!this.degreePlanCourses) {
+			return false;
+		}
+
+		const termCodes = this.degreePlanCourses.map(term => term.termCode);
+		return termCodes;
+	}
+
 }

src/app/degree-planner/term-container/term-container.component.html

@@ -2,7 +2,13 @@
     <div fxLayout="row" fxLayoutAlign="space-between stretch">
         <h2>{{ term.termCode | getTermDescription }}</h2><p class="text-right semi-bold credits">{{getTotalCredits()}} Credits</p>
     </div>
-    <div cdkDropList>
+    <div
+        cdkDropList
+        id="{{term.termCode}}"
+        [cdkDropListData]="courses"
+        [cdkDropListConnectedTo]="termCodes"
+        class="course-list"
+        (cdkDropListDropped)="drop($event)">
         <cse-course-item *ngFor="let course of courses" [course]="course" [status]="'complete'" cdkDrag></cse-course-item>
         <p *ngIf="!courses" class="no-courses text-center semi-bold">No Courses Taken</p>
     </div>

src/app/degree-planner/term-container/term-container.component.ts

@@ -12,6 +12,7 @@ import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/dr
 export class TermContainerComponent {
 	@Input() term: Term;
 	@Input() courses: Course[];
+	@Input() termCodes: String[];
 	terms: any[];
 
 	constructor() {}
@@ -26,4 +27,15 @@ export class TermContainerComponent {
 		}
 		return total;
 	}
+
+	drop(event: CdkDragDrop<string[]>) {
+		if (event.previousContainer === event.container) {
+			moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+		} else {
+			transferArrayItem(event.previousContainer.data,
+							event.container.data,
+							event.previousIndex,
+							event.currentIndex);
+		}
+	}
 }