feat(task-ilo-alignment): enhance modal component and migrate

[Mdanial01]

# Description

The task ILO alignment modal has been migrated to Angular from angularjs. This component allows admin or the tutor to rate their alignment for the tasks.

Fixes # (issue)

1. Front End Migrated from angular.js to angular

# How Has This Been Tested?

• Log in as admin and create any unit.
• Go to the settings, and then select the tab Task Alignment.
• Click on the Alignment Number and a modal will appear
• The modal appears correctly on the screen.
• Changes to the ILO task alignment are applied correctly.

Modal in Angularjs:

Modal in Migrated Angular

Testing Checklist:

• Tested in latest Chrome
• Tested in latest Safari
• Tested in latest Firefox

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings

[atharv02-git]

Hey Muhammad, good start on creating your typescript file and pushing your code to github, after pulling your repository I found that there are few things that needs to be considered, I will share my listings here:

Code styles and Guidelines:

• Added task-ilo-alignment-modal.component.ts
• The type of change is migration of task-ilo-alignment-modal.
• The issue here is you're missing task-ilo-alignment-modal.component.html file, as this file is crucial for rendering the component using Angular Material components.
• The code should incorporate Material Design components in place of Bootstrap components from the old HTML.

Configuration Issues:

• Build Failed: Due to missing dependencies

Below I am attaching links you can consider before migration:

1. Doubtfire Web - Angular.js to Angular migration guide.
2. Getting Started with material angular

[tinahoa]

Hi,
I’ve tested the component locally, and it seems we’re running into an issue with Angular that doesn't recognize the value property binding on the mat-select component. Please check it again and solve this issue. Besides, remember to delete the old coffee files to avoid conflict.