Угловые сигналы, не обновляя значение выбораHtml

Программисты Html
Ответить Пред. темаСлед. тема
Anonymous
 Угловые сигналы, не обновляя значение выбора

Сообщение Anonymous »

У меня есть многоразовый угловой компонент, который обрабатывает страницу на основе курсора. Тем не менее, значение Select никогда не изменяется на стороне HTML, но пример обнаружения изменения. Я могу выбрать свой вариант как 25 и обновления размера моей страницы. Однако пользовательский интерфейс по-прежнему читается как 10. Поэтому я не могу вернуться к размеру страницы по умолчанию 10. < /P>
См. Код ниже: < /p>
Компонент страниц < /p>
import {
ChangeDetectionStrategy,
Component,
computed,
input,
model,
Output,
signal
} from '@angular/core';
import { EventEmitter } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { CursorPaginationInput } from '@generated-types';

@Component({
selector: 'app-cursor-pagination',
imports: [FormsModule],
template: `



Items per page:

@for (size of [10, 25, 50, 100]; track size) {
{{size}}
}




← Previous



Next →



`,
changeDetection: ChangeDetectionStrategy.OnPush
})
export class CursorPaginationComponent {

hasNextPage = input.required();
hasPreviousPage = input.required();
startCursor = input(undefined);
endCursor = input(undefined);

itemsPerPage = signal(10);
str = computed(() => console.log(this.itemsPerPage(), 'lalala'));

@Output() paginationChange = new EventEmitter();

goToNext() {
if (this.hasNextPage() && this.endCursor()) {
this.paginationChange.emit({
after: this.endCursor(),
first: this.itemsPerPage(),
});
}
};

goToPrevious() {
if (this.hasPreviousPage() && this.startCursor()) {
this.paginationChange.emit({
before: this.startCursor(),
last: this.itemsPerPage(),
});
}
};

onItemsPerPageChange(event: Event) {
const newSize = parseInt((event.target as HTMLSelectElement).value, 10);
this.itemsPerPage.set(newSize);
this.paginationChange.emit({
first: newSize,
});

};
}

< /code>
родительский компонент < /p>
@let paginationMeta = (formsRxResorce.value())?.pageInfo;



export class ManageFormsComponent {
cursorPaginationInputType = signal({
after: undefined,
before: undefined,
first: 10,
last: 10,
});
formsRxResorce = rxResource({
stream: () => this.getForms,
params: () => this.cursorPaginationInputType(),
});

onPaginate(event: CursorPaginationInput) {
viewTransitionsFn(() => this.cursorPaginationInputType.set(event));
}

}



Подробнее здесь: https://stackoverflow.com/questions/797 ... lect-value
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «Html»