【问题标题】:How do I resolve and assign an inner controller from the outer's scope?如何从外部范围解析和分配内部控制器?
【发布时间】:2014-02-06 10:16:46
【问题描述】:

自解释小提琴:http://jsfiddle.net/5FG2n/1/

假设我有一个包含两个控制器的视图,一个包含另一个。外部控制器是静态的,但我需要根据外部的范围变量设置内部控制器。范围变量将是内部控制器的字符串名称(例如'InnerCtrl')。

这是视图:

<div ng-app='app' ng-controller='OuterCtrl'>
    <div ng-controller='dynamicCtrl'>
        {{result}}
    </div>
</div>

这是尚未正确的模块:

angular.module('app', [])

    .controller('OuterCtrl', ['$scope', 
        function($scope) {

            // Instead of hard coding the controller here,
            // how do I resolve the string 'InnerCtrl' to the 
            // controller function defined below, so it can be
            // assigned to this dynamicCtrl property?
            $scope.dynamicCtrl = function($scope) {
                $scope.result = 'not working yet';
            };

            //eg:
            //$scope.dynamicCtrl = resolveCtrl('InnerCtrl');                                               
        }
    ])

    .controller('InnerCtrl', ['$scope', 'service',
        function($scope, service) {
            $scope.result = service.getMessage();
        }
    ])

   .factory('service', function() {
       return {
           getMessage:  function() { return 'working!'; }
       };
    });

我尝试使用 $injector 服务:

$scope.dynamicCtrl = $injector.get('InnerCtrl');

但这给出了:“未知提供者:InnerCtrlProvider

我也想过使用 $controller 服务:

$scope.dynamicCtrl = $controller('InnerCtrl', {} /* don't want to hard code dependencies */);

但这给了我“未知的提供者:$scopeProvider

如何将控制器函数的名称解析为字符串及其依赖项,以便将其分配给范围变量?

【问题讨论】:

    标签: javascript angularjs angularjs-scope angularjs-controller


    【解决方案1】:

    我一直在寻找同样的东西,现在几个小时后终于可以工作了:

    您可以使用 $controller - 服务,但正如您所注意到的,您需要自己创建范围:

    $controller('InnerCtrl', { $scope: $scope.$new() } );
    

    别担心,所有其他变量都会被正确注入,但 Angular 无法自行创建新范围。如果你想在你的 HTML 中添加控制器,这有点复杂,你需要在 $scope 中有一个函数来暴露控制器的构造函数:

    $scope.InnerCtrl = function() {
        return $controller('InnerCtrl', { $scope: $scope.$new() }).constructor;
    }
    

    在 HTML 中你可以像往常一样使用它:&lt;ANY ng-controller="InnerCtrl"&gt;&lt;/ANY&gt;

    我写了一个post 并附上了一些额外的细节,但这是为你解决问题的主要方法。

    【讨论】:

      猜你喜欢
      • 2016-12-16
      • 2016-06-23
      • 1970-01-01
      • 1970-01-01
      • 2021-08-18
      • 2011-04-25
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多