简体   繁体   English

如何在 CSHTML 中使用 angular 创建下拉列表?

[英]How do I create a drop down list using angular inside CSHTML?

How do I create a drop down select list using angular inside CSHTML?如何在 CSHTML 中使用 angular 创建下拉选择列表? I tried the below two options but neither work.我尝试了以下两个选项,但都不起作用。 Option #1选项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>

Option #2选项#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>

Revision #2: Thanks to your help this version is definitely a lot closer.修订版 #2:感谢您的帮助,这个版本肯定更接近了。 Most of it all works except I'm not capturing the CustomerProfileId in the customerChange event.除了我没有在 customerChange 事件中捕获 CustomerProfileId 之外,大部分都有效。 How can I identify the customerID selected?如何识别所选的客户 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 Code: JS代码:

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

Option 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" })

Option 2:选项 2:

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

*.js *.js

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

Try like this像这样尝试

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何在Create.cshtml中创建下拉列表 - How to create drop down list in Create.cshtml 如何从 register.cshtml 和 register.cshtml.cs 中的 AspNetRoles 表中构建下拉列表? - how to Build drop-down list from AspNetRoles table in register.cshtml and register.cshtml.cs? 如何创建允许用户选择月份的下拉列表? - How do I create a drop down list that allows a user to choose a month? 如何使用C#在ASP MVC中的下拉列表中创建唯一的日期列表? - How do I create a unique list of dates in a drop down in ASP MVC with C#? 如何在ASP.NET MVC 3中为填充的下拉列表创建视图模型 - How do I create a view model for a populated drop down list in ASP.NET MVC 3 我可以在使用编辑器时创建下拉列表吗? - Can I create drop down list while using editor for? 使用“SAPFEWSELib”的 C# SAP 自动化。 如何按下下拉列表中的按钮? - C# SAP automation using “SAPFEWSELib”. How do I press a button from a drop down list? 如何使用下拉列表重定向,而不是按钮? - How do I redirect with a Drop Down List, and not a Button? 如何控制下拉列表中显示的屏幕保护程序名称? - How do I control the screensaver name shown in the drop down list? 如何使用MDX填充.net下拉列表? - How do you populate a .net drop down list using MDX?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM