Angularjs - 访问父控制器而不使用$ scope并使用controllerAs

时间:2015-07-27 05:41:39

标签: javascript angularjs scope angularjs-controlleras

我需要一种方法来访问控制器的父作用域,而不必注入$ scope来执行此操作。这背后的原因是我正在构建一个SPA,我想根据当前页面将一个类应用于body元素。我不想只为了改变课程而将$ scope注入我的每一个控制器中。如果有一种方法可以使用$ routeprovider或一个很好的服务封装这个功能,请告诉我是否以错误的方式查看。我刚刚开始使用Angular,所以如果解决方案非常简单,我会提前道歉,但我无法通过Google搜索找到与我的情况类似的任何内容。

以下是基本设置:

的index.html

<body ng-controller="BodyController as body" class="contact-page">
    <nav> ... </nav>
    <main ng-view>
        <div ng-controller="ContactController as contact>
           Contact Page loaded in on click
        </div>
    </main>
</body>

body.controller.js

(function() {
    angular
        .module('app')
        .controller('BodyController', BodyController);

    function BodyController() {
        var body = this;
    }
})();

contact.controller.js

(function() {
    angular
        .module('app')
        .controller('ContactController', ContactController);

    ContactController.$inject = [];

    function ContactController($scope) {
        var vm = this;
    }
})();

app.routes.js

(function () {
    angular
        .module('app')
        .config(routes);

    routes.$inject = ['$routeProvider', '$locationProvider'];

    function routes($routeProvider, $locationProvider) {
        $routeProvider
            .when('/', {
                templateUrl: 'app/home/home.html',
                controller: 'HomeController',
                controllerAs: 'home'
            }).when('/contact', {
                templateUrl: 'app/contact/contact.html',
                controller: 'ContactController',
                controllerAs: 'contact'
            }).otherwise({
                redirectTo: '/'
            });
        $locationProvider.html5Mode(true);
    }

})();

0 个答案:

没有答案