如何使用大量手表重构控制器

时间:2016-02-15 17:46:06

标签: angularjs angularjs-scope

我有一个带有许多手表的控制器(这里只显示一个),我想将控制器代码/逻辑移到控制器外部以使其变薄。请参阅下面的代码。下面注释掉的部分(//这个有效)与我现在的那部分相比没有。一旦将函数定义移出控制器,我就无法访问money.a和money.b. (我正在使用John Papa风格指南,这就是我在trade.money.b而不是vm.money.b上观看的原因)

    <!DOCTYPE html>
    <html lang="en" ng-app="MyApp">
    <head></head>
    <body ng-controller="AppCtrl as trade">

    <div>
        <input type="text" ng-model="trade.money.a">
        <input type="text" ng-model="trade.money.b">
        <input type="text" ng-model="trade.money.c">
    </div>

    <script>
        angular.module('MyApp', [])
                .controller('AppCtrl', function($scope) {

                    var vm = this;
                    vm.money = {};
                    vm.money.a = 4;
                    vm.money.b = 5;

                    //This works
    //                $scope.$watch('trade.money.b',function(newVal,oldVal) {
    //                    vm.money.c = 2*(vm.money.a + vm.money.b);
    //                });

                    //This does not work
                    $scope.$watch('trade.money.b',updateQuant);
                });

        function updateQuant(newVal,oldVal) {

            //vm is not defined.
            vm.money.c = 2*(vm.money.a + vm.money.b);
        }

    </script>
    </body>
    </html>

0 个答案:

没有答案