ngOptions не работает, даже с базовым примером

Question

Я очень плохо знаком с Angular и немного ошеломлен.

Насколько я понимаю, у меня есть компонент, из которого я могу отображать данные типа {{ this }}, который работает нормально. Теперь я хочу выбрать те данные, которые находятся в component.ts. Это массив строк:

private strategies: string[] = ["ASAP", "W&T"];

Теперь в моем component.html я хочу создать выборку с этими строками в качестве параметров.

<select ngModel="result" ngOptions="value for value in strategies">
</select>
{{ result }}

Но список опций всегда пуст. {{ strategies }} дает ASAP,W&T, что правильно. Даже если я использую базовый пример, такой как:

<select ngModel="result" ngOptions="value for value in ['a', 'b']">
</select>

список опций полностью пуст. Чего мне не хватает?

Answer 1

Вам нужно использовать ngFor на options, чтобы построить параметры в угловых (v2 +): Также убедитесь, что strategies, определенный в компоненте, является публичным и, следовательно, доступным в шаблоне.

<select  [(ngModel)]="result">
    <option *ngFor="let strategy of strategies" [value]="strategy">
        {{strategy.name}}
    </option>
</select>

Также убедитесь, что вы используете имя переменной из *ngFor для привязки значения и атрибут отображения для параметров.

ng-options был частью angularJS и не используется в Angular v2 +.

Answer 2

AngularJS мы используем директиву ngOptions для создания списка элементов для выбора, но из Angular 2+ и выше Angular предоставляют новую структурную директиву *ngFor, которая поможет создать динамический список.

И получитьВыбранное значение из HTML Angular обеспечивает двухстороннюю директиву привязки данных под названием ngModel.Привязка двух данных в Angular 2+ немного отличается, как показано ниже

Пример -

<select  [(ngModel)]="result">
    <option *ngFor="let strategy of strategies" [value]="strategy">
        {{strategy.name}}
    </option>
</select>

Надеюсь, эта помощь!