【问题标题】:Use a modal ng-controller as a regular controller使用模态 ng-controller 作为常规控制器
【发布时间】:2015-02-10 07:08:53
【问题描述】:

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

我这样称呼模态:

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

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

这是我如何引导我的自定义视图 (custom.html):

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

【问题讨论】:

    标签: javascript angularjs twitter-bootstrap angular-ui angular-ui-bootstrap


    【解决方案1】:

    执行此操作的一种方法是定义与您的解析具有相同名称的服务或值(在本例中为variable)。然后 Angular 会为你找到依赖并注入它。

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

    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() 函数来声明具有许多属性的可注入对象:

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

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

    【讨论】:

    • 谢谢,但是如何添加多个变量?我应该为每个变量更改值的名称(use.me.conditionally)吗?我可以将它们全部放入一次或循环添加吗?
    • @ncohen 我将编辑我的答案,您可以使用value()service() 方法传递一个对象。
    • @ncohen 也不要太担心模块(在我的例子中是'use.me.condtionally'),你真的不需要额外的模块。您可以同样使用现有的“myApp”模块。如果你有时不想使用这个模态控制器,我只建议一个单独的模块,因此不需要值/服务。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-06-10
    • 1970-01-01
    • 2010-10-18
    • 2015-03-03
    • 2014-02-07
    相关资源
    最近更新 更多