Когда я console.log выбор радиокнопки пользователя, то какие журналы всегда один за

Question

По какой-то причине, когда я console.log выбор переключателя пользователя, то, что журналы на консоли всегда позади. Почему это должно быть? У меня есть выбор переключателя по умолчанию, установленный на «все» для начального состояния. Когда пользователь нажимает «Вариант A», то, что ведет журнал на консоль, является «все» из исходного состояния. Когда я снова нажимаю, на этот раз в «Варианте B», какие журналы являются «Вариантом A» из предыдущего выбора. Почему это одно? Как я могу это решить?

public user: User; 

    public categories = [ 
    { value: 'T', display: 'All', count: 232 }, 
    { value: 'A', display: 'Choice A', count: 22 }, 
    { value: 'B', display: 'Choice B', count: 43 }, 
    { value: 'C', display: 'Choice C', count: 35 }, 
    { value: 'D', display: 'Choice D', count: 62 }, 
    ]; 

    ngOnInit() { 
    this.user = { 
     category: this.categories[0].value 
    } 
    } 

    select(isValid: boolean, f: User) { 
    if (!isValid) return; 
    console.log(f); 
    console.log(this.user.category); 
    } 

И HTML:

<form #f="ngForm" novalidate> 
    <div class="form-group"> 
    <div class="radio" *ngFor="let category of categories"> 
     <label> 
     <input type="radio" name="category" [(ngModel)]="user.category" [value]="category.value" (click)="select(f.value, f.valid)"> 
     {{category.display}} 
     </label> 
     <span class="num-results">{{category.count}}</span> 
    </div> 
    </div> 
</form> 

Answer 1

Использование ngModelChange вместо click

(ngModelChange)="select(f.value, f.valid)" 

(click) событие обрабатывается до ngModel имел возможность обновить форму.

Порядок привязок по элементу не определяется в каком порядке обрабатываются события.