Question

你能告诉我如何以角度方式将一个组件移动到另一个组件吗？。我想在用户点击按钮时显示第二页..这应该打扮这个组件

这是我的代码 http://plnkr.co/edit/NXo357FdZ5ir834JYuXi?p=preview

import {Component,View} from 'angular2/core';

@Component({
    selector: 'second',
})

@View({
  templateUrl: 'second/second.html'
})
export class secondComponent {

}

Answer 1

您应该使用路由器组件，点击Here了解详情。我认为最好有一个主要组件负责保存路由器组件和应用程序路由的配置。就像这样：

    import {Component} from "angular2/core";
    import {ROUTER_DIRECTIVES,RouteConfig} from "angular2/router";
    @Component({
        selector: 'my-app',
        template: `<router-outlet></router-outlet>`,
        directives: [ROUTER_DIRECTIVES]
    })

    @RouteConfig([
        //define your routes here...
    ])

    export class MainComponent {

    }

一旦定义了路线，请在 AppComponent 的构造函数中初始化它：

constructor(private _router:Router) {
}

然后您应该将onclck功能更改为：

onclck(){
    this._router.navigate(['SecondComponent']);
}

SecondComponent是您的@RouteConfing中定义的第二个组件的路线名称。

编辑：这是plunker。仔细查看 app \ boot.ts 文件。

如何将一个组件以角度移动到另一个组件？

1 个答案: