Looking at the excitement of Cricket Premier League in your friend circle, you have decided to make a web application using MEAN Stack. The application allow users to form their own Cricket Premier League teams from a given a list of players. If a user is not able to find the desired player in the list, the user can add a new player to the list and then add it to the team.
User can change the role of an already existing player (Batsman, Bowler, Wicket Keeper). User can delete a player from the list. However, updating and deletion of players in the list must be reflected in team that user made.
To make this application challenging you put a condition that the formed team must be a valid team. A valid team has exactly 2 Batsman, 2 Bowler and 1 Wicket Keeper.
Your application must prompt the user, below mentioned messages if they form an invalid team.
‘You do not have required number of batsmen in your team’
‘You do not have required number of bowler in your team’
‘You do not have required number of wicketkeeper in your team’
You need to make changes in –
A player is represented with 3 main properties:
1. name: denoting the name of player.
2. description: denoting the role of player (Batsman, Bowler, Wicket Keeper).
3. inTeam: whether or not this player is part of the team.
- Do not change label, input, button vs. attributes since it will disrupt application behavior (like id, \*ngFor, component name attributes).
- Implementation related specifics are added directly as comments in the workspace.
- Ensure that the structure and datatype of the components are followed as specified in the comments to ensure that the code is evaluated correctly.
- Use Test App button often as described below (step 4), so you will be guided by test error messages.
- When you delete or edit something you shouldn’t have, test messages will give an error accordingly.
- Click the “submit app” in the run dropdown once all the tasks are completed.Once all tasks are successfully implemented, you will receive an answer key.
- Go back to the question and save the answer key in the text editor below.
1. Click on the triangle play icon shown on the left side panel.
2. Scroll to the run bar.
3. You will find a dropdown in the top left side of the screen that says “Start&Debug”. -> You can click on this to start the application for previewing the project in browser and debugging.
4. The next entry is called “Test App” . You can use this to test your application when you have successfully completed the task set in the problem statement.
5. The next entry in the dropdown is called “Submit App”. You can select this entry and click on the play icon to submit your application code once you have completed all the tasks assigned.
If the task is completed successfully an alphanumeric code will be displayed. This code needs to be pasted in the answer box provided in the platform, and the save answer button below it needs to be clicked to successfully complete evaluation.
Note 1: You need to click on the play icon selected in step 1 after selecting the required entry from dropdown mentioned in step 2 to experience the behaviour described above.
Note 2: Please ensure that instruction in step 5 is followed completely, otherwise your code may not be evaluated.
- MEAN Stack