Angular：如何在调用函数之前将值绑定到变量

Question

我正在使用 ngb-rating 开发评级系统，但是当我评级时，直到第二次调用该函数时才发送值，这意味着该函数在值被绑定之前被调用！

我尝试在函数参数中传递绑定值，但没有任何变化

html:
 <ngb-rating [(rate)]="currentRate" max="5">
 <ng-template let-fill="fill" let-index="index">
 <span class="star" [class.filled]="fill === 100" [class.bad]="index < 2" 
 (click)="evaluate(r.service.proprietaire.username)">&#9733;</span>
 </ng-template>
 </ngb-rating>
 <hr>
 <pre>evaluation: <b>{{currentRate}}</b></pre>
 typescript:   
export class MesReservationsComponent implements OnInit {
currentRate;

constructor(private evaluerUserService:EvaluerUserService) { }

ngOnInit() {
this.mesReservations();
}

evaluate(partenaireId){
var note = this.currentRate;
this.evaluerUserService.evaluateUser(note,partenaireId).subscribe();
}
}

Answer 1

我建议您使用 rateChange 输出：

<ngb-rating [(rate)]="currentRate" (rateChange)="evaluate(r.service.proprietaire.username, $event)" max="5">
    <ng-template let-fill="fill" let-index="index">
        <span class="star" [class.filled]="fill === 100" [class.bad]="index < 2">&#9733;</span>
    </ng-template>
</ngb-rating>
<hr>
<pre>evaluation: <b>{{currentRate}}</b></pre>

现在新汇率将被传递到 evaluate 方法中。

如果出于某种原因，您绝对必须使用点击，我会在您的评估方法中设置一个超时：

evaluate(partenaireId){
    window.setTimeout(() => {
        var note = this.currentRate;
        this.evaluerUserService.evaluateUser(note,partenaireId).subscribe();
    });
}

这将使 Bootstrap 有时间在您执行操作之前更新模型值。

Angular：如何在调用函数之前将值绑定到变量

Angular : How do i bind value to a variable before i call a function

ng-bootstrap

angular