javascript - AngularJS ng-click不适用于$ routeProvider中的controllerAs

我正在用Angular自学，并且为此编写了一个小型应用程序。我正在遵循John Papa的Angular样式指南，并使用Controllers，而不是$ scope（Y030）。

问题是当我在ng-view模板中使用类似ng-click =“ vm.doSomething（）”的东西时，不会触发该事件。没有来自控制台的消息。如果我使用$ scope，则该应用程序可以正常工作。

要使其工作，只需将“ greet.configure（）”替换为“ configure（）”即可。

有什么提示吗？

完整的应用程序可以在这里找到：

https://github.com/ajkret/spring-boot-sample/tree/controllerAs-ngView-ngClick-problem



这是路由代码：

(function() {
    'use strict';

    angular.module('app').config([ '$routeProvider', routing ]);

    function routing($routeProvider) {
        $routeProvider.when('/greet', {
            templateUrl : 'app/components/greet/greet.html',
            controller : 'GreetingCtrl',
            controllerAs : 'greet'
        }).when('/config', {
            templateUrl : 'app/components/config/config.html',
            controller : 'ConfigCtrl',
            controllerAs : 'config'
        }).otherwise({
            redirectTo : '/greet'
        });
    }

})();

这是模板：

<div class="row">
    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xl-6">
        <div class="panel panel-default">
            <div class="panel-heading">Presentation</div>
            <div class="panel-body">Here is the message of the day</div>
        </div>
    </div>

    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-xl-6">
        <div class="panel panel-default">
            <div class="panel-heading">Result from Server</div>
            <div class="panel-body">
                <h3>{{greet.message}}</h3>
                <button type="button" class="btn btn-primary" ng-click="greet.configure()">Configure</button>
            </div>
        </div>
    </div>
</div>

这是控制器：

(function() {
    'use strict';

    angular.module('app').controller('GreetingCtrl', GreetController);

    GreetController.$inject = ['GreetingService','$location','$scope'];

    function GreetController($service, $location, $scope) {
        var controller = this;
        var message;

        function get() {
            $service.get(function(greet) {
                controller.message = greet.message;
            });
        }

        function configure() {
            $location.url('config');
        }

        $scope.configure = configure;

        // Bootstrap
        get();
    }
})();

最佳答案

将$scope.configure = configure;替换为controller.configure = configure;

关于javascript - AngularJS ng-click不适用于$ routeProvider中的controllerAs，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36239834/