Я нашел несколько сообщений, включая ngSwitchCase в angular 2 вместо ngSwitchWhen, Как выполнить привязку к '*ngSwitchCase' и Angular 2 — ngSwitchCase. Гугл вообще не помог.
Я пытаюсь создать простую форму для ввода критериев поиска. Первый компонент — это поле выбора, а второй компонент — поле ввода. В зависимости от типа поиска, который вы выполняете, я хочу использовать другой ввод для электронной почты, номера телефона и т. д.
Я подаю свой выбор из констант, определенных в моей форме.
const SEARCH_BY_EMAIL = 'email';
const SEARCH_BY_PHONE = 'phone';
const SEARCH_BY_POSTAL_CODE = 'postalCode';
@Component({
selector: 'app-choose-search-criteria',
templateUrl: './choose-search-criteria.component.html',
styleUrls: ['./choose-search-criteria.component.css']
})
export class ChooseSearchCriteriaComponent implements OnInit {
searchTypes = [
{value: SEARCH_BY_EMAIL, label: 'Email'},
{value: SEARCH_BY_PHONE, label: 'Phone Number'},
{value: SEARCH_BY_POSTAL_CODE, label: 'Zip Code'}
];
searchBy: string;
searchValue = '';
constructor(protected dialogRef: MatDialogRef<ChooseSearchCriteriaComponent>,
@Inject(MAT_DIALOG_DATA) public data: ChooseCriteriaDialogData) { }
ngOnInit() {
}
}
<h2>Enter Search Values</h2>
<div class="formFields">
<mat-form-field>
<mat-label>Search By</mat-label>
<mat-select [(value)]="searchBy">
<mat-option *ngFor="let searchType of searchTypes" [value]="searchType.value">
{{searchType.label}}
</mat-option>
</mat-select>
</mat-form-field>
<div [ngSwitch]="searchBy">
<mat-form-field *ngSwitchCase="SEARCH_BY_EMAIL">
<input matInput placeholder="Enter Email Address" type="email" [(ngModel)]="searchValue"/>
</mat-form-field>
<mat-form-field *ngSwitchCase="SEARCH_BY_PHONE">
<input matInput placeholder="Enter Phone Number" type="number" [(ngModel)]="searchValue"/>
</mat-form-field>
<mat-form-field *ngSwitchCase="SEARCH_BY_POSTAL_CODE">
<input matInput placeholder="Enter Zip Code" type="number" [(ngModel)]="searchValue"/>
</mat-form-field>
<p *ngSwitchDefault>Select how you wish to search.</p>
</div>
</div>
Проблема в том, что он не находит мои константы в ngSwitchCase. Я также пробовал {SEARCH_BY_POSTAL_CODE} и {{SEARCH_BY_POSTAL_CODE}}, но они тоже не работают.
Итак, я застрял. Совет, пожалуйста?
const
внутрь класса компонента. - person ConnorsFan   schedule 14.06.2019