-
-
Notifications
You must be signed in to change notification settings - Fork 2.2k
Answer:1 Angular projection challenge #1334
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
|
||
@Component({ | ||
selector: 'app-list-item', | ||
template: ` | ||
<div class="border-grey-300 flex justify-between border px-2 py-1"> | ||
{{ name() }} | ||
<button (click)="delete(id())"> | ||
<ng-content></ng-content> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nitpick: use self-closing tag. it's nicer 😅
this.studentStore.deleteOne(id); | ||
} | ||
} | ||
delete = output<number>(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you don't need to output the id, you can just emit an event and the parent will passs the id to the function
[name]="item.firstName" | ||
[id]="item.id" | ||
[type]="type()"></app-list-item> | ||
<app-list-item [id]="item.id" (delete)="delete.emit($event)"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you could move the app-list-item directly in the parent. but this works
readonly list = input<any[] | null>(null); | ||
readonly type = input.required<CardType>(); | ||
readonly cardImgSrc = input.required<string>(); | ||
readonly nameTemplate = input<TemplateRef<any>>(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
why do you use an input, most of the time you should use a contentchild with template
|
||
ngOnInit(): void { | ||
this.http.fetchCities$.subscribe((t) => this.store.addAll(t)); | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you could try to refactor this using httpRessource or rxRessource to be more declarative
great work |
Checklist for challenge submission
Warning:
Alternatively, you can still submit your PR to join the list of answered challenges or to be reviewed by a community member. 🔥