Question

我在Angular视图中有以下html下拉列表：

HTML

        <select>
          <option value="Func 1">
                <button class="btn ui-button ui-widget ui-state-default ui-corner-all" ng-click="callFunc1()">
                    <span class="btn-icon add"></span>
                    Func 1
                </button>   
          </option>
          <option value="Func 2">
                <button class="btn ui-button ui-widget ui-state-default ui-corner-all" ng-click="callFunc2()">
                    <span class="btn-icon add"></span>
                    Func 2
                </button>   
          </option>
        </select>

JS

        $scope.callFunc1= function() {
            alert('func 1');

        }; 

        $scope.callFunc2 = function() {
            alert('func 2');

        };

我的问题是附加到ng-clicks的功能没有触发。

谁能告诉我为什么？

Answer 1

我建议遵循与此格式类似的内容。您如何决定传递数据完全取决于您，但这应该提供一些指导。

<div ng-controller="testCtrl">
    <!--js-->
    <script>
    app.controller('testCtrl',function($scope){

        $scope.selectValue = undefined;

        $scope.event = function(){
            console.log($scope.selectValue)
        }
    })
    </script>
    <div>
        <select ng-model="selectValue" ng-change="event()">
        <option value="test">something</option>
        <option value="test2">something2</option>
        </select>
    </div>
</div>

确保所有html都在您的控制器中，并且您已使用ng-app启动了html的正文（上面未显示）。当您对选择输入进行更改时，ng-change将触发您传递的表达式。此外，ng-change要求您为元素指定ng-model值。

ng-click函数不在html select元素内触发

1 个答案: