例如:
我有2项服务
1)one.service.ts
2)two.service.ts
我有一个组件 - dashboard.component.ts
import { Component, ViewEncapsulation, Inject } from '@angular/core';
import { OneService } from '../services/one.service';
import { TwoService } from '../services/two.service';
@Component({
selector: 'dashboard',
encapsulation: ViewEncapsulation.Emulated,
styleUrls: ['./dashboard.less'],
templateUrl: './dashboard.html'
})
export class DashboardComponent {
constructor() {
// Here how do I get service instance based on some this condition.
if(true) {
/* Service **one.service.ts** to be injected */
} else {
/* Service **two.service.ts** to be injected */
}
}
}
角度API文档提供了一些想法.但我不清楚.提供的示例Self使用ReflectiveInjector例举使用.
然而,人们很少,如果有的话,用ReflectiveInjector在实际的应用程序代码(可能更多的测试)..你能给的,你会用一个例子@Self 来代替的@Host这样的测试场景之外？
dependency-injection angular-decorator angular2-services angular
我正在使用Angular 5中的Material Component处理一个项目.我确实更新了我的Visual代码,但我不知道发生了什么.我正面临一个问题"类型'ElementRef'不是通用的." 从早上起我一直坚持这个问题.
这一行出错
_inputElement: ElementRef<HTMLInputElement>;
constructor(toggleGroup: MatButtonToggleGroup, _changeDetectorRef: ChangeDetectorRef, _elementRef: ElementRef<HTMLInputElement>, _focusMonitor: FocusMonitor);
angular2-forms angular2-template angular2-services angular angular5
我们安装角火力基地
npm install firebase angularfire2 --save
而且这个错误发生了
ERROR in node_modules/angularfire2/firebase.app.module.d.ts(10,22): error TS2420: Class 'FirebaseApp' incorrectly implements interface 'FirebaseApp'.
Property 'automaticDataCollectionEnabled' is missing in type 'FirebaseApp'.
我怎么解决呢？
简单场景:
我有多个服务实现了一个通用接口.所有这些服务都在bootstrap方法中注册.
现在我想要另一个服务,它注入所有实现公共接口的注册服务.
即
export interface MyInterface {
foo(): void;
}
export class Service1 implements MyInterface {
foo() { console.out("bar"); }
}
export class Service2 implements MyInterface {
foo() { console.out("baz"); }
}
export class CollectorService {
constructor(services:MyInterface[]) {
services.forEach(s => s.foo());
}
}
这有可能吗？
我正在订阅组件构造函数中的store属性
constructor(private someService: SomeService){
someService.someObservable.subscribe((data: Some)=> {
this.some = data;
console.log('changed');
});
}
在服务中,构造函数如下所示:
constructor(private store: Store<any>){
this.someObservable = <Observable<{}>>store.select('some');
}
我一直在改变这个对象的状态,但是日志只出现一次.还有一点奇怪的是,我正在this.some我的模板中直接访问该属性(没有async管道),它完全更新!看起来该this.some属性正在更新,但next()订阅中的功能不起作用.
帮助任何人？谢谢!
我反复遇到一种情况,我想访问路由器插座另一侧存在的子组件而不是选择器:
Like:
<router-outlet></router-outlet>
NOT:
<selector-name></selector-name>
这与我所知道的ViewChild功能相冲突,但似乎我的组件应该能够看到路由器内部的内容并与之交互,就像选择器标签内的内容一样容易.
比如我试过这个:
export class RequestItemCatsComp {
@ViewChild('child') child: RequestItemsComp;
***etc...***
ngAfterViewInit() {
if (this.child) // Always child is undefined
this.groupId = this.child.groupId;
}
}
但很自然,孩子是不确定的,因为这是错误的方式.有正确的方法吗？
我正在尝试使用服务来共享数据,但后来遇到另一个问题"表达在检查后已经改变",我希望能够在没有黑客攻击或启用prod模式的情况下解决这个问题.
我需要在用户成功登录并使用Angular 2重定向到主页后创建一个动态菜单.完全像第一个类似的问题,除了我不能硬核菜单项.
#app.component.html#
<navbar>
<!--Here I want to create menu items-->
</navbar>
<div class="container">
<div class="col-sm-12">
<router-outlet></router-outlet>
</div>
</div>
<div id="footer" class="inner-wrap">
<div class="row no-padding">
<div class="col-sm-12 no-padding">
</div>
</div>
</div>
**home.component.ts**
import { Component, OnInit } from '@angular/core';
import { User } from '../_models/index';
import { UserService } from '../_services/index';
@Component({
//moduleId: module.id,
templateUrl: 'home.component.html'
})
export class HomeComponent implements OnInit {
users: User[] = [];
constructor(private userService: UserService) { }
ngOnInit() {
<!-- how we can create …我需要获取以下http调用的状态代码并将其作为字符串返回
//This method must return the status of the http response
confirmEmail(mailToken):Observable<String>{
return this.http.get(this.baseUrl+"users/activate?mailToken="+mailToken)
.map(this.extractData)
.catch(this.handleError);
}
谢谢!
我正在尝试使用嵌套子组件中的按钮切换位于主App模板顶部的侧面导航菜单.我无法弄清楚如何到达父级中的sidenav组件来告诉它sidenav.open().
我知道子组件上的@Input和@Output,但据我所知,要使用它,我需要为子组件添加某种DOM标记来附加它们吗？如:
<app>
<sidenav-component #sidenav>...</sidenav-component>
<child [someInput]="some_parent_var" (childOpensNav)="sidenav.open()"></child>
</app>
关于如何做到这一点的文章很多.问题是我正在路由到此组件,因此<child>代码中没有明确存在标记.相反,我的代码是这样的:
<app>
<sidenav-component #sidenav>...</sidenav-component>
<router-outlet></router-outlet>
</app>
如果我有一个子组件被路由到,我该怎么做sidenav.open()或以某种方式访问孩子的父组件？
一些想法:我已经做了一些研究并思考了几种方法,并且不确定它们是否正确或甚至可以工作......一种方法是使用Injector服务并尝试遍历父母,但这感觉不对:
// child component
constructor(injector: Injector) {
this.something = injector.parent.get(Something);
}
或者可能在父级中创建一个服务,以某种方式附加到Sidenav组件,然后将此服务注入到子级中？