Question

这是我的html：

<form class="row" (ngSubmit)="generatePdfFromOverview()" #generatePdfForm="ngForm">
    <select id="selectedSortOnItem" required [(ngModel)]="generatePdfForm.selectedSortOnItem"
        name="selectedSortOnItem" #selectedSortOnItem="ngModel">
            <option *ngFor="let sortOnItem of sortOnItems" [value]="sortOnItem">{{sortOnItem}}</option>
    </select>
    <button type="submit" class="btn btn-primary">Generate it!</button>
</form>

这些值在视图中显示正常。

但是，当我选择另一个值时，.ts文件中的值不会更新。尝试了无数事物。遵循了Angular文档中的示例，但似乎不起作用。

Answer 1

尽管这完全取决于您的generatePdfFromOverview方法，但是您可以采取一些措施来解决此问题：

将generatePdfForm作为参数传递给generatePdfFromOverview，然后在其上使用value属性以获取表单的值。

<form 
  class="row" 
  (ngSubmit)="generatePdfFromOverview(generatePdfForm)" 
  #generatePdfForm="ngForm">

然后在您的组件类中：

generatePdfFromOverview(generatePdfForm) {
  console.log('Form Value: ', generatePdfForm.value);
}

此value将具有您想要的selectedSortOnItem属性。

这是您推荐的Sample StackBlitz。

Answer 2

结果证明这与https://materializecss.com/

问题有关

Materialize中的javascript导致选择功能出现问题。

升级到1.0.0解决了该问题。

无法在Angular 7中获得select的值

2 个答案: