如何在控制器中调用所选选项的值?

时间:2015-12-07 06:18:53

标签: angularjs

 <div class="field-wrap">
    <select name=courses class="input-field1"  name="state" title="state" ng-model="signup.state" >
                    <option value="">Select State</option>
                    <option value="Andaman and Nicobar Islands">Andaman and Nicobar Islands</option>
                    <option value="Andhra Pradesh">Andhra Pradesh</option>
                    <option value="Arunachal Pradesh">Arunachal Pradesh</option>
                    <option value="Assam">Assam</option>
                    <option value="Bihar">Bihar</option>
                    <option value="Chandigarh">Chandigarh</option>
                    <option value="Chhattisgarh">Chhattisgarh</option>
                    <option value="Dadra and Nagar Haveli">Dadra and Nagar Haveli</option>
                    <option value="Daman and Diu">Daman and Diu</option>
                    <option value="Delhi">Delhi</option>
                    <option value="Goa">Goa</option>
                    <option value="Gujarat">Gujarat</option>
                    <option value="Haryana">Haryana</option>
                    <option value="Himachal Pradesh">Himachal Pradesh</option>
                    <option value="Jammu and Kashmir">Jammu and Kashmir</option>
                    <option value="Jharkhand">Jharkhand</option>
                    <option value="Karnataka">Karnataka</option>
                    <option value="Kerala">Kerala</option>
                    <option value="Lakshadweep">Lakshadweep</option>
                    <option value="Madhya Pradesh">Madhya Pradesh</option>
                    <option value="Maharashtra">Maharashtra</option>
                    <option value="Manipur">Manipur</option>
                    <option value="Meghalaya">Meghalaya</option>
                    <option value="Mizoram">Mizoram</option>
                    <option value="Nagaland">Nagaland</option>
                    <option value="Orissa">Orissa</option>
                    <option value="Pondicherry">Pondicherry</option>
                    <option value="Punjab">Punjab</option>
                    <option value="Rajasthan">Rajasthan</option>
                    <option value="Sikkim">Sikkim</option>
                    <option value="Tamil Nadu">Tamil Nadu</option>
                    <option value="Tripura">Tripura</option>
                    <option value="Uttaranchal">Uttaranchal</option>
                    <option value="Uttar Pradesh">Uttar Pradesh</option>
                    <option value="West Bengal">West Bengal</option>
                    </select>
        </div>

这是我正在使用的选择菜单我想在我的控制器中获取所选值但不知道如何做到这一点,我已经获取了文本框的值,但不知道选择框。< / p>

$scope.signupForm = function() {
                        if ($scope.signup_form.$valid) {
                            var data = {
                                firstname : $scope.signup_form.firstname.$modelValue,
                                lastname : $scope.signup_form.lastname.$modelValue,
                                email : $scope.signup_form.email.$modelValue,
                                mobileNumber : $scope.signup_form.mobileNumber.$modelValue,
                                district : $scope.signup_form.district.$modelValue,
                                state : $scope.signup_form.state.$modelValue,
                                course : $scope.signup_form.course.$modelValue,
                                collegeName : $scope.signup_form.collegeName.$modelValue,

                            };

这是我的控制器,我想我必须使用ng-option但不确定。 感谢

3 个答案:

答案 0 :(得分:0)

在您的情况下,$ scope.signup.state将具有选定状态的值。 所选选项的值将保存到分配给下拉列表的模型中

答案 1 :(得分:0)

我建议在Controller中添加一个选项数组,而不是在HTML中对其进行硬编码,然后使用ng-options指令显示该数组中的选项,你最终得到的结果如下:

/**
 * This is a description of the function and what it does.
 * @param argument1 this is a description of a parameter
 * @param argument2 this is a description of a second parameter
 * @return this is a description of what the function returns
 */
 public boolean myFunction(argument1, argument2){
     ...

(其中options是控制器内声明的选项数组

<select name=courses class="input-field1"  name="state" title="state" ng-model="signup.state" ng-options="option in options"> 

然后您可以简单地将该输入绑定到ng-model并定期从控制器中使用

$scope.options = ['option1', 'option2'];

将允许您访问所选的任何选项

答案 2 :(得分:0)

您可以在此处使用ng-change。当从下拉列表中选择一个选项时,将触发此方法,我们可以保留所选的选项数据。

<强> HTML

<div>
    <select  ng-model="selState" ng-change="selectedState(selState)" 
     data-ng-options="state as state.name for state in states">
        <option value="">Select Account</option>
    </select> 
   {{selectedState}}     
</div>

<强>的script.js

myApp.controller('Ctrl', function($scope) {
       $scope.states=[
                        {name:"AP"},
                        {name:"Karnataka"},
                        {name:"Tamilnadu"}
                      ];

        $scope.selectedState = function(item) {
          alert(item.name);
        };

工作Plunker