角度API文档提供了一些想法.但我不清楚.提供的示例Self使用ReflectiveInjector例举使用.
然而,人们很少,如果有的话,用ReflectiveInjector在实际的应用程序代码(可能更多的测试)..你能给的,你会用一个例子@Self 来代替的@Host这样的测试场景之外？
dependency-injection angular-decorator angular2-services angular
我刚开始使用Angular 2,并想知道为什么有些属性喜欢selector和template放在组件装饰器而不是组件类中.
在Angular 2中使用所有这些装饰器有什么意义？
角度依赖注入允许您使用令牌而不是服务类注入字符串,函数或对象.
我在我的模块中声明它是这样的:
providers: [{ provide: MyValueToken, useValue: 'my title value'}]
我这样使用它:
constructor(@Inject(MyValueToken) my_value: string) {
this.title = my_value;
}
但是,如何更新组件中的值并让其他组件每次都获得新值？换句话说,我想模拟使用类似a BehaviorSubject来发射和接收值的功能.
如果这不可能,那么如果它们仅提供静态数据,那么这些注入令牌值的用途是什么,而我可以简单地在我的组件中声明静态值并直接使用它.
typescript angular-services angular-decorator angular angular-di
我们正在使用Angular 5和材料设计,并使用辅助方法创建我们自己的组件,用于各种功能(即动态列生成mat-table).
我想要一种方法将未知属性从我的父组件传递到我的子组件.这在React中很容易,例如:
App类渲染
<MyDatatable knownVar="1" otherKnownVar="2" unknownButKnownToChildVar="3" />
MyDataTable渲染
<MatComponent {...this.props} />
这种方式如果MatComponent更新了它所采用的属性,MyDataTable就不必更新.我看过@Input装饰器,但这似乎不利于未知变量.
我想到的一个解决方案就是通过一个对象和帐户来传递该对象,@Input但我不喜欢这个,因为我希望angular-material组件文档准确反映开发人员应该如何使用我的 MyDataTable组件.
我的问题的简短版本:如何将未知的属性级数据传递给Angular 5中的子组件？
我有这个组件通过其选择器接收两个输入,但这可以扩展到任意数量的输入和任何组件.因此,在组件本身消耗多个属性的过程中,单个@Input()装饰器不允许我使用多个属性,因此作为一种解决方法,我使用了两个装饰器用于两个输入属性,但我不认为这是解决的唯一方法这样的场景.
export class AsyncComponent {
@Input() waitFor: boolean;
@Input() message: string; // TODO: Verify if multiple inputs are needed for multiple props
}
更新
<app-async [waitFor]="true" message="foo"><app-async>
那么,是否有可能用任何其他方式只使用一个装饰器来获取任意数量的输入道具？如果有更多的道具,我路过除了waitFor和message我会做的每个支撑以下.
@Input() waitFor: boolean;
@Input() message: string;
@Input() someOtherProp: string;
....
或者有没有其他方法只有一个Input装饰器并消耗任何数量的属性？
Angular组件有装饰器:
@Component({ ... })
export class MyAngularComponent {
@Input() myInputParam: MyType;
@Input() myOtherInputParam: MyOtherType;
@Output() myOutputParam: MyOtherOutputType;
}
我有一个Angular库,如果我能以编程方式检索@Input()给定组件类(虽然属于库)中的 Angular的装饰器,可以避免很多代码重复(并减少bundle大小).
但我怀疑这种实现的可移植性.我已经读过某个地方,如果Angular应用程序是在启用了AoT的情况下构建的(并且只使用了Angular装饰器),则不需要Reflect polyfill(在运行时读取装饰器所需).所以我认为我不能只使用Reflect.*.Angular如何存储装饰器？是否有可靠,面向未来的方式来阅读它们？
缩小应该不是问题,因为它只用于读取库组件的装饰器,所以我可以控制它.
所以,如果这是可行的方式(或者不是,我仍然感兴趣),我怎么能读取那些装饰器？
angular-decorator angular2-decorators angular-compiler-cli angular
一种常见的做法是将服务包括在 @NgModule.providers
@NgModule({
providers: [
MessageService
]
})
根据Angular 教程，您可以提供服务而无需在@NgModule装饰器中指定它，通过使用@injectable.providedIn
@Injectable({
providedIn: 'root',
})
export class MessageService {...}
使用 Angular 教程中介绍的方法有什么好处吗？
angular-services angular-decorator angular-providers angular
组件 .ts 文件中的行@Component({})称为Decorator。这与装饰模式有关，还是无关？
decorator typescript angular-decorator typescript-decorator angular
我想要什么（伪代码）：
@Component({
selector: 'app-some-component',
....
})
export class SomeComponentComponent {
constructor() {
console.log(@COMPONENT.SELECTOR); // logs 'app-some-component'
}
....
}
背景：
我有一个简单的组件：
@Component({
selector: 'app-some-component',
....
})
export class SomeComponentComponent { ....
现在在这个组件中，我想创建一个唯一标识符，其中应包含一些组件的名称。
例子：
'app-some-component_' + UuidUtil.generateUUID();
显然，如果我这样做会更好：
SELECTOR + '_' + UuidUtil.generateUUID();
但随后我必须将选择器声明为外部变量，但我遇到了问题，因为我的 IDE (Webstorm) 在 *.html 模板中向我提供了未知的选择器。
我怎样才能做到这一点。
@duplication 那里发布的解决方案非常hacky，因为需要将元素 ref 转换为小写。我希望两年后，有更好的方法。也许也是由于打字稿的进一步发展。
我对 Angular 中的指令和装饰器很困惑。我认为任何以 @ 为前缀的东西都是装饰器，现在当我读到指令时它说，组件是指令。这是怎么回事？对此事的任何澄清都会有所帮助。