Question

我正在开发一个Web应用程序。使用Angular v5和Angular Material，我按照official docs.

的步骤创建了一个自动完成字段。

但是，我遇到了一个错误：

DialogTransferencia.html:5 ERROR Error: Cannot find control with unspecified name attribute
        at _throwError (forms.js:2432)
        at setUpControl (forms.js:2300)
        at FormControlDirective.ngOnChanges (forms.js:6459)
        at checkAndUpdateDirectiveInline (core.js:12365)
        at checkAndUpdateNodeInline (core.js:13893)
        at checkAndUpdateNode (core.js:13836)
        at debugCheckAndUpdateNode (core.js:14729)
        at debugCheckDirectivesFn (core.js:14670)
        at Object.eval [as updateDirectives] (DialogTransferencia.html:5)
        at Object.debugUpdateDirectives [as updateDirectives] (core.js:14655)

这是我的代码：

<mat-horizontal-stepper #stepper="matHorizontalStepper">
<mat-step>
  <form class="example-form">
    <mat-form-field class="example-full-width">
      <input type="text" placeholder="Pick one" aria-label="Number" matInput [formControl]="userController" [matAutocomplete]="auto">
        <mat-autocomplete #auto="matAutocomplete">
          <mat-option *ngFor="let option of filteredOwners | async" [value]="option">
            {{ option }}
          </mat-option>
        </mat-autocomplete>
      </mat-form-field>
    </form>
  </mat-step>

然后将FormControl绑定在这里：

import {Component,Input, Output, ViewChild, Inject} from '@angular/core';
import {FormBuilder, FormGroup, Validators, FormControl} from '@angular/forms';
import {MatStepperModule} from '@angular/material/stepper';
import {MatAutocompleteModule} from '@angular/material/autocomplete';
import {SelectorUsuarios} from './selector_usuarios.component';
import {PropietariosAPIService} from '../services/propietariosAPI.service';
import {Picker}  from './picker.component';
import { MAT_CHECKBOX_CLICK_ACTION } from '@angular/material/checkbox';
import {MatSnackBarModule, MatSnackBar} from '@angular/material/snack-bar';
import { ChangeOwnerAPIService } from '../services/changeOwner.service';
import {Observable} from 'rxjs';
import {map, startWith} from 'rxjs/operators';
declare var jquery:any;
declare var $ :any;

/**
 * @title Stepper overview
 */
@Component({
  selector: 'pasos-transferencia',
  templateUrl: '../views/pasos_transferencia.component.html',
  styleUrls: [],
  providers: [ChangeOwnerAPIService,MatSnackBarModule],
})
export class PasosTransferencia {
  @Input()
  public token;
  isLinear = false;
  public usuario;
  public usuarionuevo;
  usuarios = [];
  usuariosnuevos = [];
  @Input() 
  copia: boolean;
  @Input() 
  transferir: boolean;
  firstFormGroup: FormGroup;
  secondFormGroup: FormGroup;
  selectorUsuarios: SelectorUsuarios;
  arrayFiles;
  arrayFilesNames;
  @ViewChild('picker') child;

  public userController : FormControl; //Controlador del formulario de seleccion de propietarios
  filteredOwners: Observable<string[]>;

  constructor(private _formBuilder: FormBuilder,private propietariosAPI: PropietariosAPIService, private ownershipAPI: ChangeOwnerAPIService, private snackBar: MatSnackBar) {
    this.userController = new FormControl();
   }

   options = [
     'One','Two','Three'
   ];

  ngOnInit() {
    this.copia = false;
    this.transferir = false;
    this.arrayFiles =[];

    this.filteredOwners = this.userController.valueChanges
          .pipe(
            startWith(''),
            map(val => this.filter(val))
          );
    }

    filter(val: string): string [] {
      return this.options.filter(option => option.toLowerCase().indexOf(val.toLocaleLowerCase()) === 0);
    }

我想搜索mat-stepper组件。谢谢！

Answer 1

对不起，我使用的是MaterialDialog，上面的代码是MaterialDialog的子级。也许，Angular编译器找不到formControl，因为必须将其定义为MaterialDialog类。

Angular 5 -Material FormControl：找不到具有未指定名称属性的控件

1 个答案: