javascript - ng-change 不触发

Question

ng-change 无论如何都不会触发我的函数，这是 View ；

            <div ng-controller="widgets.lunchMenu as vm">
                   <label class="btn btn-transparent grey-salsa btn-circle btn-sm active">
                        <input type="radio" name="options" class="toggle" id="option1" ng-model="vm.takeCount" ng-value="0" ng-change="vm.getLunchMenus()">@L("Today")
                    </label>
                    <label class="btn btn-transparent grey-salsa btn-circle btn-sm">
                        <input type="radio" name="options" class="toggle" id="option2" ng-model="vm.takeCount" ng-value="7" ng-change="vm.getLunchMenus()">@L("Week")
                    </label>
                    <label class="btn btn-transparent grey-salsa btn-circle btn-sm">
                        <input type="radio" name="options" class="toggle" id="option3" ng-model="vm.takeCount" ng-value="30" ng-change="vm.getLunchMenus()">@L("Month")
                    </label>
            </div>

这是 Controller :

    (function () {
    appModule.controller('widgets.lunchMenu', [
    '$scope', 'abp.services.app.lunch',
    function ($scope, appService) {
        var vm = this;
        var today = new Date();
        var month = today.getMonth();

        vm.getLunchMenus = function () {
            appService.getLunchMenus({ month: month + 1, takeCount: vm.takeCount }).success(function (data) {
                vm.menus = data.items;
            });;
        };

        vm.getLunchMenus();
    }
]);
})();

有什么建议吗？感谢您的帮助。

Answer 1

为了让 ng-change 指令能够看到 vm.getLunchMenus 函数，它必须位于 $scope 上>。因此，您需要执行以下操作:

$scope.vm = this;
$scope.vm = function() { ... }

然后在你的标记中，你可以做你正在做的事情

ng-change="vm.getLunchMenus()"

<小时/>

或者你可以做一些简单的事情

$scope.getLunchMenus = function() { ... }

然后在标记中:

ng-change="getLunchmenus()"

请完全消除对 vm 变量的需求，因为 this 对指令来说没有任何意义(ng-change，等)在标记中。