如何在 CSHTML 中使用 angular 創建下拉列表？

Question

如何在 CSHTML 中使用 angular 創建下拉選擇列表？ 我嘗試了以下兩個選項，但都不起作用。 選項1

        <div class="col-sm-2">
            <div class="form-group">
                <label for="customers">Customer</label>
                <input id="{{customer.CustomerProfileId}}" ng-model="filter.customers" type="text" class="form-control selected" />
            </div>
        </div>

選項#2

    <div class="col-sm-2">
        <div class="form-group">
            <label for="customers">Customer2</label>
            <select id="{{customer.CustomerProfileId}}" ng-model="filter.customers" ng-options="for customer in filter.customers" type="text" class="form-control">{{customer.CustomerName}}</select>
        </div>
    </div>

修訂版 #2：感謝您的幫助，這個版本肯定更接近了。 除了我沒有在 customerChange 事件中捕獲 CustomerProfileId 之外，大部分都有效。 如何識別所選的客戶 ID？

            <div class="col-sm-2">
                <div class="form-group">
                    <label for="customers">Customer</label>
                    <select class="form-control" ng-model="parameters.AvaliableCustomers" ng-change="customerChange(c.CustomerProfileId)" ng-options="c.CustomerName for c in parameters.AvaliableCustomers track by c.CustomerProfileId">
                        <option value="">-- Select --</option>
                    </select>
                </div>
            </div>

JS代碼：

    $scope.customerChange = function (customerId) {
        var temp = customerId;
    }

Answer 1

選項1：

  @Html.DropDownListFor(model => model.Gender, new List<SelectListItem>(), new { @class = "form-control", @ng_model = "gender", @ng_options = "item as item.name for item in genders track by item.value" })

選項 2：

<select name="Gender" ng-options="item as item.name for item in genders track by item.value" ng-model="gender"></select>

*.js

$scope.genders =
[
    { value: "M", name: "Male" },
    { value: "F", name: "Female" }
];

Answer 2

像這樣嘗試

<select formControlName="countryControl" [(ngModel)]="filter.customers">
   <option [value]="customer.CustomerProfileId" *ngFor="let customer of filter.customers">             {{customer.CustomerName}}</option>
 </select>