首先:是的,我已经事先谷歌搜索,并且solution出现了不适合我。如何让Angular2在渲染组件之前等待诺言
语境
我有一个角2成分调用的服务,并且需要一旦接收到该响应执行一些数据操作:
ngOnInit() {
myService.getData()
.then((data) => {
this.myData = /* manipulate data */ ;
})
.catch(console.error);
}
在其模板中,该数据是传递给子组件:
<child-component [myData]="myData"></child-component>
这是导致孩子出错的错误myData
未定义。上面发布的谷歌结果谈到了使用Resolver
,但这不适合我。
当我创建一个新的解析器:
import { Injectable } from '@angular/core';
import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
import { Observable } from 'rxjs/Rx';
import { MyService } from './my.service';
@Injectable()
export class MyResolver implements Resolve<any> {
constructor(private myService: MyService) {}
resolve (route: ActivatedRouteSnapshot): Observable<any> {
return Observable.from(this.myService.getData());
}
}
app.routing.ts
const appRoutes: Routes = [
{
path: 'my-component',
component: MyComponent,
resolve: {
myData: MyDataResolver
}
}
];
export const routing = RouterModule.forRoot(appRoutes);
我得到一个错误,没有提供者MyDataResolver
。这仍是如此,当我在app.component.ts添加MyDataResolver
到providers
属性:
@Component({
selector: 'my-app',
templateUrl: 'app/app.component.html',
providers: [
MyService,
MyResolver
]
})
一直使用这个接口改变了吗?
你可以实现“myData的”孩子的财产作为setter和检查“未定义”呢? – rook
它是'MyResolver'还是'MyDataResolver'。您的问题中的代码似乎不一致。 –