javascript - 如何动态分配 Angular 工厂方法？

Question

实际上我的要求是动态分配 Angular 工厂方法。

请看一下这段代码:

angular.forEach(scope.mapperData.collections.controltype.rowset, function (value, index) {
    if (value.controltypeid == scope.controlId){
        scope.controlData = value.controltypename;
        controlContent = angular.element(layoutControlsFactory[scope.controlData]());
        $compile(controlContent)(scope);
        element.append(controlContent);
    }
}); 

var controlContent = angular.element(layoutControlsFactory[scope.controlData]());

上面的代码中有scope.controlData。该值将动态变化。我需要分配类似

var controlContent = angular.element(layoutControlsFactory[ThirdPartyAutoComplete]());

或者

var controlContent = angular.element(layoutControlsFactory.ThirdPartyAutoComplete());

layoutControlsFactory代码

bosAppModule.factory("layoutControlsFactory",function($compile){
    var layoutControlsFactory={};

    layoutControlsFactory.ThirdPartyAutoComplete=function(controlId){
        console.log("## Create ThirdPartyAutoComplete");
        var template='<input kendo-auto-complete>';
        return template;
    };


    return layoutControlsFactory;
});

我尝试过，但显示错误。

typeError: layoutControlsFactory[scope.controlData] is not a function

我想我很好地解释了我的要求。如果您需要更多详细信息，请告诉我。任何人都可以帮助我实现这一目标吗？

Answer 1

使用方括号表示法时，方括号中的位需要是字符串

var controlContent = angular.element(layoutControlsFactory[ThirdPartyAutoComplete]());

应该是

var controlContent = angular.element(layoutControlsFactory["ThirdPartyAutoComplete"]());

可以在此处查看模型示例:https://jsfiddle.net/jyonvcj4/1/