Question

在包含该卡的整个组件周围放置一个锚标签("[routerLink]")正在改变样式（创建一个链接类以尝试禁用样式并没有帮助。）

动态创建（例如，ngFor）卡（在本例中为md-card）作为可点击链接的正确方法是什么？

换句话说，每张卡都是可点击的，并链接到不同的视图。

Answer 1

如果您不需要使用routerLink，则可以使用单击事件并从组件内部导航。

示例组件：

import { Component, OnInit } from '@angular/core';
import {Router} from '@angular/router';

interface Thing{
    name:string;
    route:string;
}

@Component({
    selector: 'app-things',
    template: `
        <md-card *ngFor="let thing of things" (click)="navigate(thing)">
            Simple card
        </md-card>
    `
})
export class ThingsComponent implements OnInit {
    things: Thing[];

    constructor(
        private router: Router
    ) { 
        //todo initialize things
    }

    navigate(thing:Thing){
        this.router.navigate(thing.route);
    }
}

在Angular 2 Material中创建md-cards作为链接

1 个答案: