Question

您好我希望在从给定下拉列表中选择任何内容时调用特定函数。该函数需要选择选项的值作为参数。到目前为止，这就是我所拥有的：

    <label class="control-label col-lg-3">Action Type</label>
    <div class="col-lg-9">
        <select class="form-control" id="type" >
            <option value="">Please Select</option>
            <option value="SCHEDULE" ng-click="getHtml(/*SCHEDULE*/)">
                SCHEDULE
            </option>
            <option value="HTTP" ng-click="getHtml(/*HTTP*/)" >
                HTTP
            </option>
            <option value="RMQ" ng-click="getHtml(/*RMQ*/)">
                RMQ
            </option>
            <option value="WFE" ng-click="getHtml(/*WFE*/)">
                WFE
            </option>
        </select>
    </div>

然而，这似乎不起作用。有人可以帮忙吗？

该方法在控制器中为：

$scope.getHtml=function(option){
        console.log("sent type is: "+type);
        var type=$('#type').val();
        //BLAH BLAH...
}

Answer 1

您需要在此使用ng-change，

首先将模型分配给select

ng-model="modelName" modelName是scope variable，其值为select box，

秒从ng-click="getHtml..)删除options。

并使用ng-change，当选择框更改其值时，您可以调用值为modelName变量的控制器函数。

<select class="form-control" id="type" ng-change="getHtml(modelName)" ng-model="modelName">
        <option value="">Please Select</option>
        <option value="SCHEDULE">
            SCHEDULE
        </option>
       .....
</select>

Answer 2

您应该在select元素上使用ngChange和ngModel指令。

ngChange：当用户更改输入时评估给定的表达式。

实施例

<select class="form-control" id="type" ng-model='type' ng-change="getHtml(type)">
    <option value="">Please Select</option>
    <option value="SCHEDULE">SCHEDULE</option>
    <option value="HTTP">HTTP</option>
    <option value="RMQ">RMQ</option>
    <option value="WFE">WFE</option>
</select>

DEMO

绑定ng-click到选项值

2 个答案: