Pesquisa de site

angular - O valor do componente pai não está mudando devido ao seu componente filho


seletor de data -https://plnkr.co/edit/4mLtl6?p=preview

 <datepicker [id]="'create-invoice-invoice-date'" [(value)]="duedate"></datepicker>

Eu passei "duedate" para o seletor de datas, mas no meu componente do aplicativo, não obtive reflexão de mudança.

Resposta #1

tente adicionar (change)="function(data){...} em vez de [(value)]. No entanto, você pode usar o input do tipo date.

Se você realmente quer seu vinculação de dados bidirecional, você deve ter dentro do seu componente datepicker o seguinte:

 @Input() value: string;

E então o emissor:

@Output() valueChange = new EventEmitter<string>();

E quando o valor mudar, emitir o evento.

Resposta #2

Você não pode vincular uma saída sem escrever a lógica de tratamento de eventos no Angular - isso ocorre porque "binding bidirecional" é implementado como binding de dados unidirecional + vinculação de eventos, pois isso evita o custo de desempenho substancial do "verdadeiro" binding bidirecional de dados (que foi um dos problemas de desempenho com AngularJS).

No entanto, é muito fácil de implementar usando os métodos get e set. Usando seu exemplo (observe que eu renomeei seu parâmetro de entrada de value para invoiceDate), você precisa adicionar o seguinte código. Note, em particular, os métodos estabelecidos para obter e definir invoiceDate - o que nos dá a capacidade de emit() o valor da nossa variável local privada invoiceDateValue para quaisquer observadores externos.

private invoiceDateValue: string = "";
@Output() invoiceDateChange = new EventEmitter();

@Input()
get invoiceDate() {
  return this.invoiceDateValue;
}

set invoiceDate(val) {
  this.invoiceDateValue = val;
  this.invoiceDateChange.emit(this.invoiceDateValue);
}

Aqui está o plunk completo incluindo o acima: https://plnkr.co/edit/WBdmUp?p=preview