您好我正在使用angularMaterial2为typescript创建一个对话框,我可以生成对话框,但是页面末尾的这个加载不会超过其他类似的元素。
这是我的.TS
import { Component, OnInit, Input } from '@angular/core';
import {Sponsor} from '../entitys/sponsor'
import {MdDialog, MdDialogRef} from '@angular/material';
@Component({
selector: '[sponsor-tile]',
templateUrl: './sponsor-tile.component.html',
styleUrls: ['./sponsor-tile.component.css']
})
export class SponsorTileComponent implements OnInit {
@Input() sponsor: Sponsor;
constructor(public dialog: MdDialog) {}
ngOnInit() {
console.log(this.sponsor);
}
descModal(): void{
let dialogRef = this.dialog.open(DialogSponsorTileComponent);
dialogRef.afterClosed().subscribe(result => {
console.log(result);
});
}
}
@Component({
selector: 'dialog-sponsor-tile',
templateUrl: './dialog-sponsor-tile.html'
})
export class DialogSponsorTileComponent{
constructor(public dialogRef: MdDialogRef<DialogSponsorTileComponent>){}
}
和我的HTML:
<img src="{{sponsor.Logoogo}}" class="speaker-img">
<h3>{{sponsor.Name}}</h3>
<p (click)="descModal()" >{{sponsor.Description}}</p>
<ul class="speaker-social">
<li *ngIf="sponsor.Facebook !== null" ><a href="{{sponsor.Facebook}}"><span class="ti-facebook"></span></a></li>
<li *ngIf="sponsor.Twitter !== null" ><a href="{{sponsor.Twitter}}"><span class="ti-twitter-alt"></span></a></li>
<li *ngIf="sponsor.Linkedin !== null" ><a href="{{sponsor.Linkedin}}"><span class="ti-linkedin"></span></a></li>
</ul>
对话框的HTML:
<h1 md-dialog-title>Dialog</h1>
<div md-dialog-content>What would you like to do?</div>
<div md-dialog-actions>
<button md-button (click)="dialogRef.close('Option 1')">Option 1</button>
<button md-button (click)="dialogRef.close('Option 2')">Option 2</button>
</div>
我在material.angular.io
的例子中做了这个答案 0 :(得分:0)
我认为selector: 'sponsor-tile',
就像这样:Http.get