Angular:如何在select(jQuery-UI组合框选择)上添加事件更改?

时间:2015-10-20 20:50:19

标签: javascript jquery angularjs jquery-ui

HTML:

<select style='width:60px;' combobox>
     <option ng-repeat='item in sizePriceWeighArr' value='{{ item.id }}' price='{{ item.price }}' weight='{{ item.weight }}' size='{{ item.size }}'>{{ item.size }}</option>
</select>

JS:

.controller('productController', ['$scope', '$location', '$http', '$q', '$window', '$stateParams', function($scope, $location, $http, $q, $window, $stateParams) {
    // Some code here to form array of products
    $scope.sizePriceWeighArr = productObj.sizePriceWeigh;
}])
.directive('combobox', function() {
    return {
        restrict: 'A',
        link: function($scope, element, attrs) {
            $(element).combobox();                              
        }
    }
})

在指令中我形成了一个jQuery-UI组合框选择。但我需要以某种方式在select,控制器或指令中捕获更改事件。

1 个答案:

答案 0 :(得分:0)

您目前正在使用select,所以为什么不使用ngChange:

<select style='width:60px;' combobox ng-change="changeFunction()">
<option ng-repeat='item in sizePriceWeighArr' value='{{ item.id }}' 
price='{{ item.price }}' weight='{{ item.weight }}' size='{{ item.size }}'>    
{{ item.size }}</option>
</select>

JS:

.controller('productController', ['$scope', '$location', '$http', '$q', '$window', '$stateParams', function($scope, $location, $http, $q, $window, $stateParams) {
// Some code here to form array of products
$scope.sizePriceWeighArr = productObj.sizePriceWeigh;

function changeFunction(){
    //your code.
}
}])
.directive('combobox', function() {
return {
    restrict: 'A',
    link: function($scope, element, attrs) {
        $(element).combobox();                              
    }
}
})