使用angularJS传播Select并读取选项

时间:2015-04-15 12:53:55

标签: angularjs

我有一个问题是要读取在选择中传播的所选信息。

<div ng-show="deviceDetail != null" ng-model="example" >
    <select >
        <option value="NONE">Select</option>
        <option ng-repeat="option in deviceDetail" ng-change="selectOption()">{{option}}</option>
    </select>
    <br/>
    The value of the selection is: {{example}}
  </div>

这是HTML代码,在{{example}}我希望看到用户选择的信息。

这是js的一部分:

$scope.selectOption = function() {
        $scope.example = option.productName;
    };

我该如何解决?

万分感谢!

4 个答案:

答案 0 :(得分:1)

您应该传递当前选项:

<select >
        <option value="NONE">Select</option>
        <option ng-repeat="option in deviceDetail" ng-change="selectOption(option )">{{option}}</option>
    </select>

$scope.selectOption = function(option) {
        $scope.example = option; // is there property .productName?;
    };

答案 1 :(得分:1)

直接在example设置<select>范围变量,而不是调用ng-change事件并分配到该功能。

您也可以使用ng-options直接将 option.name 设置为示例模型。

此处您已将ng-model指令应用于div代码。

<div>不是输入元素,因此请将ng-model应用于<select>元素。

我建议使用ng-options指令填写<select>中的选择列表。 ng-repeat也没关系。

这里你正在关注ng-change事件,所以在函数中如果需要那么你可以传递触发事件的对象,这样你就可以使用该对象或对其执行任何操作。

以下是修改后的模板。

<div ng-show="deviceDetail != null">
    <select >
        <option value="NONE">Select</option>
        <option ng-model="example" ng-options="option in deviceDetail" ng-change="selectOption(option)">{{option}}</option>
    </select>
    <br/>
    The value of the selection is: {{example}}
</div>

答案 2 :(得分:1)

试试这个:

<div ng-show="deviceDetail != null">
  <select >
    <option value="NONE">Select</option>
    <option ng-model="option" ng-options="option in deviceDetail" ng-change="selectOption(option)">
    {{option}}</option>
</select>
<br/>
   The value of the selection is: {{example}}

Js:

         $scope.selectOption = function(option) {
         $scope.example = option;
       };

答案 3 :(得分:1)

你应该使用ng-options                   
      选择的值是:{{example}}