在Angular 1.x中,UI-Router是我的主要工具.通过返回"解析"值的承诺,路由器将在呈现指令之前等待承诺完成.
或者,在Angular 1.x中,null对象不会使模板崩溃 - 所以如果我不介意暂时不完整的渲染,我可以$digest在promise.then()填充最初为空的模型对象后使用它进行渲染.
在这两种方法中,如果可能的话,我宁愿等待加载视图,如果无法加载资源,则取消路由导航.这为我节省了"取消导航"的工作.编辑:注意这具体意味着这个问题要求Angular 2期货兼容或最佳实践方法来执行此操作,并要求尽可能避免使用"Elvis操作符"!因此,我没有选择那个答案.
但是,这两种方法都不适用于Angular 2.0.当然,有一个标准的解决方案计划或可用于此.有谁知道它是什么?
@Component() {
template: '{{cats.captchans.funniest}}'
}
export class CatsComponent {
public cats: CatsModel;
ngOnInit () {
this._http.get('/api/v1/cats').subscribe(response => cats = response.json());
}
}
Run Code Online (Sandbox Code Playgroud)
以下问题可能反映了相同的问题:加载数据PROMISE后的Angular 2渲染模板.请注意,问题中没有代码或接受的答案.
我的页面中有一个子导航,在公共主视图下方显示一些子视图.我想通过一个对象传递给子视图,<router-outlet>这样我就可以在主组件中检索一次数据,然后与子组件共享它.
注意:如果我<one></one>在main.html中包含该指令,它可以工作,但这不是我想要的行为.
主要观点:
<h1>Details</h1>
<a [router-link]="['./sub1']">One</a> |
<a [router-link]="['./sub2']">Two</a> |
<a [router-link]="['./sub3']">Three</a>
<hr/>
<router-outlet [data]="maindata"></router-outlet>
Run Code Online (Sandbox Code Playgroud)
子视图1:
<h2>{{ data.name }}</h2>
...
Run Code Online (Sandbox Code Playgroud)
主要观点:
@Component({
selector: 'main-detail',
directives: [ROUTER_DIRECTIVES],
templateUrl: './main.html'
})
@RouteConfig([
{ path: '/', redirectTo: '/one' },
{ path: '/one', as: 'One', component: OneComponent },
{ path: '/two', as: 'Two', component: TwoComponent },
{ path: '/three', as: 'Three', component: ThreeComponent }
])
export class MainComponent {
maindata: Object = {name:'jim'};
}
Run Code Online (Sandbox Code Playgroud)
子视图1:
@Component({
selector: 'one', …Run Code Online (Sandbox Code Playgroud) 在Angular 1中,我的配置如下所示:
$routeProvider
.when("/news", {
templateUrl: "newsView.html",
controller: "newsController",
resolve: {
message: function(messageService){
return messageService.getMessage();
}
}
})
Run Code Online (Sandbox Code Playgroud)
如何在Angular2中使用resolve?
我正在尝试构建一个Angular2原型(基于alpha44)我们的Angular1应用程序(相当复杂的一个),我正在尝试在使用路由和子路由时找到最佳的模型/数据架构.
在我的示例中,从路由创建的子组件,我想访问父组件的属性(托管router-outlet).
但是当你从创建一个组件router-outlet,你不能使用@Input和@Output了.那么注入一些数据/属性的最佳实践是什么,除了基本routeParams和静态routeData?
如何在没有太多耦合的情况下与父组件通信?