角1.5.组件 - 通过Binded属性区分父控制器的最佳方法是什么?



i具有一个AngularJS 1.5组件,该组件代表带有NG-Options的选择下拉。具体的事情是,这些NG选项被动态填充不同的数据(来自常数文件),具体取决于命名为组件的名称属性的值,并来自父母控制器。
例如,我的组件看起来像这样:

test.component.js

angular
    .module('test.component')
    .component('Selector', {
        controller: Selector,
        controllerAs: 'vm',
        templateUrl: 'selector.html',
        bindings: {
            model: '=',
            form: '<',
            name:'@',
            label:'@',
            constant: '<',
        }
    });
    function Selector(CONSTANTS, SOME_OTHER_CONSTANTS) {
        var vm = this;
        switch(vm.name) {
            case 'Name1':
            vm.constant = CONSTANTS;
            break;
            case 'Name2' :
            vm.constant = SOME_OTHER_CONSTANTS;
            break;
        }
    }

因此,在父控制器的视图中,就是这样:
parent-view.html

<selector
  name="Name1"
  form="vm.myForm"
  model="vm.myModel>
</selector>

它可以正常工作,但也许不是一个好主意,可以通过name属性区分父级控制器和数据,因为它主要用于表单验证。为了区分父级控制器,最好使用什么,以便能够根据这一点将不同的数据填充到NG选项中?

任何帮助和建议将不胜感激。

如果只有2个常数 - 如果可以使用,则可以使用20个不同的注射器:

function Selector($injector) {
        var vm = this;
        vm.constant  = $injector.get(constantProvider);    
    }
<selector
  constant-provider="SOME_OTHER_CONSTANTS"
  form="vm.myForm"
  model="vm.myModel>
</selector>

如果您有多个要按名称来解决常数的地方,则可以尝试制作单独的工厂来存储所有这些小常数:

module.factory('MyConstants', function(CONSTANTS, SOME_OTHER_CONSTANTS) {
  return {
    name1: CONSTANTS, name2: SOME_OTHER_CONSTANTS
  }
});

相关内容

  • 没有找到相关文章

最新更新