Question

我正在研究允许用户动态输入规则的组件，这些规则可以是不同的类型，并且取决于规则类型，将捕获不同的值。

我已经创建了动态组件，我的问题是将初始值传递给动态创建的组件。

每个规则的值完全不同，因此我尝试在注射器中使用useValue，但是如果我添加一个参数以接受构造函数中的值，则它无法解析参数。

我的喷油器组件：

getInjector(rule) {
  let inject = this.injectors[rule.name];
  if (!inject) {
    inject = Injector.create([{ provide: 'initialValues', useValue: rule.values }], this.inj);
    this.injectors[rule.name] = inject;
  }

  return inject;
}

我想要类似的东西：

export class MandatoryRuleComponent implements OnInit {
  values: any={};
  constructor(initialValues:any) { this.values = initialValues }

  ngOnInit() {
  if(!this.values.threshold){
    this.values.threshold = 9;
  }
 }
}

完整的代码可以在Stackblitz

上找到

Answer 1

您需要get在动态组件中传递值。参见official example。

所以，在这种情况下，请执行以下操作：

import { Component, OnInit, Injector } from '@angular/core';

@Component({
  selector: 'app-deprecated-rule',
  templateUrl: './deprecated-rule.component.html',
  styleUrls: ['./deprecated-rule.component.css']
})
export class DeprecatedRuleComponent implements OnInit {

  values: any = {};

  constructor(private injector: Injector) { }

  ngOnInit() {
    // get provided data
    this.values = this.injector.get('initialValues');

    if (!this.values.adjustment) {
      this.values.adjustment = 999;
    }
  }
}

还请注意

string 令牌，您应该使用Type<T>或改为InjectionToken<T>个实例
create(providers: StaticProvider[], parent?: Injector)（功能自v5起已弃用），您应该使用新的签名Injector.create(options)：
```
create(options: {providers: StaticProvider[], parent?: Injector, name?: string})
```

更新了STACKBLITZ

将值注入Angular中的动态组件

1 个答案: