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

Question

在包含卡片的整个组件周围放置 anchor 标记 ("[routerLink]") 会改变样式(创建链接类来尝试禁用样式没有帮助)。

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

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

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);
    }
}