javascript - 使用模态 ng-controller 作为常规 Controller

Question

我有一个由模态视图使用的 Controller (带有 angularui)。在某些时候，我想将此 Controller 与自定义 View (而不是模态视图)一起使用。所以除了解析变量(发送到 Controller 的变量)之外，一切都很好。

我这样称呼模态:

    var modalInstance = $modal.open({
        templateUrl: 'myModal.html',
        controller: 'modalCtrl',
        size: 'lg',
        resolve: {
            variable: function(){
                return myVar;
            }
        }
    });

如何从 javascript(或 html)发送变量？

以下是我如何 Bootstrap 自定义 View (custom.html):

angular.element($(document.body)[0].children[0]).attr('ng-controller','modalCtrl');
angular.bootstrap( document.body, [ 'myApp' ]);

Answer 1

实现此目的的一种方法是定义一个与您的解析名称相同的服务或值(在本例中为变量)。然后 Angular 会为你找到依赖项并注入(inject)它。

您可能不希望始终定义此服务/值。因此，您可以在模块中定义此服务/值，然后在 Bootstrap 应用程序时有条件地加载该模块:

if (someCondition) {
  angular.module('use.me.conditionally', []).value('variables', 123);
  angular.element($(document.body)[0].children[0]).attr('ng-controller','modalCtrl');
  angular.bootstrap(document.body, ['myApp', 'use.me.conditionally']);
} else {
  angular.bootstrap(document.body, ['myApp']);
}

编辑:

您可以使用 value() 或 service() 函数来声明具有许多属性的可注入(inject)对象:

var foo = { property1: 'abc', property2: 456 };
angular.module('use.me.conditionally',[])
    .value('variablesAsAValue', foo)
    .service('variablesAsAService', function() { return foo; });

请注意，您不需要同时使用 value() 和 service()，我只是展示这两种方法。 value() 通常用于常量类型的变量，服务通常是对象/类。