Ist das ein genauer Typescript Code?
interface User {
id: number;
firstName: string;
lastName: string;
email: string;
password: string;
}
let users: User[] = [];
let currentUserId: number | null = null;
const userForm = document.getElementById('userForm') as HTMLFormElement;
const firstNameInput = document.getElementById('firstName') as HTMLInputElement;
const lastNameInput = document.getElementById('lastName') as HTMLInputElement;
const emailInput = document.getElementById('email') as HTMLInputElement;
const passwordInput = document.getElementById('password') as HTMLInputElement;
const userTableBody = document.getElementById('userTableBody') as HTMLTableSectionElement;
userForm.addEventListener('submit', (event) => {
event.preventDefault();
if (currentUserId === null) {
addUser();
} else {
updateUser();
}
userForm.reset();
currentUserId = null;
});
function addUser() {
const newUser: User = {
id: Date.now(),
firstName: firstNameInput.value,
lastName: lastNameInput.value,
email: emailInput.value,
password: passwordInput.value,
};
users.push(newUser);
renderUserTable();
}
function updateUser() {
const user = users.find((u) => u.id === currentUserId);
if (user) {
user.firstName = firstNameInput.value;
user.lastName = lastNameInput.value;
user.email = emailInput.value;
user.password = passwordInput.value;
renderUserTable();
}
}
function deleteUser(id: number) {
users = users.filter((user) => user.id !== id);
renderUserTable();
}
function editUser(id: number) {
const user = users.find((u) => u.id === id);
if (user) {
currentUserId = id;
firstNameInput.value = user.firstName;
lastNameInput.value = user.lastName;
emailInput.value = user.email;
passwordInput.value = user.password;
}
}
function renderUserTable() {
userTableBody.innerHTML = '';
users.forEach((user) => {
const row = document.createElement('tr');
row.innerHTML = `
<td>${user.firstName}</td>
<td>${user.lastName}</td>
<td>${user.email}</td>
<td>
<button onclick="editUser(${user.id})">Bearbeiten</button>
<button onclick="deleteUser(${user.id})">Löschen</button>
</td>
`;
userTableBody.appendChild(row);
});
}
Bitte es soll nichts von Js haben, sondern wirklich die Typescript Merkmale beeinhalten
Studium,
Code,
Informatik,
Programmiersprache,
TypeScript
