使用NgModel的角度双向绑定不会更新值

Question

我正在尝试在Angular中实现一个选择框，以便能够在订单之间进行切换。我也有一个通用表，该表需要一个api Url来获取特定的顺序。 api网址是在ts文件中一起构建的，并且包含我尝试使用[(ngModel)]绑定的orderIds。当我使用选择框在{{orderId}}之间切换时，我希望更新表。

当我使用以下实现时，{{orderFilesApi}}会在我更改选择框时更新，但是.ts（和表数据）不会更新。

您知道我在做什么错吗？

@Input() orderId = '123'; @Output() orderFilesApi = this.serverUrl + '?' + 'orderid=' + this.orderId; orders: Orders[] = [ {value: '123', viewValue: 'ORDER1'}, {value: '456', viewValue: 'ORDER2'} ]; 文件：

.html

<mat-form-field> <mat-select placeholder="Change Order" [(ngModel)]="orderId"> <mat-option *ngFor="let order of orders" [value]="order.value"> {{order.viewValue}} </mat-option> </mat-select> </mat-form-field> <div>{{orderId}}</div> <div>{{orderFilesApi}}</div> <app-data-table [apiUrl]="orderFilesApi" [displayedColumns]="['name', 'type']"> </app-data-table> 文件：

let button = app.buttons["createHomeGroupButton"]
let buttonExists = button.waitForExistence(timeout: 10)
XCTAssert(buttonExists)

Answer 1

您可以在MatSelect的onSelectionChange属性上编写函数以更新两个值（orderId和orderFilesApi）

Answer 2

查看您发布的代码可能有两个原因：

1. 如果

   <app-data-table [apiUrl]="orderFilesApi" [displayedColumns]="['name', 'type']"> </app-data-table>

   用不同的html

   喜欢

   this.orderFilesApi.emit(this.serverUrl + '?' + 'orderid=' + this.orderId);

   在更改事件中。

2. 如果

   <app-data-table [apiUrl]="orderFilesApi" [displayedColumns]="['name', 'type']"> </app-data-table>

   使用相同的html

   将输出属性更改为普通属性，例如@output（）orderFilesApi并设置为简单属性

   this.orderFilesApi = this.serverUrl + '?' + 'orderid=' + this.orderId

   在更改事件中。