我如何 open/close kendo 对话框?
how do i open/close the kendo dialog?
我正在为 angular 2 尝试 kendo ui 并且关闭、单击事件似乎在 kendo 对话框中起作用。但是有打开和关闭对话框的方法吗?还是我必须为此使用 javascript?
此处为简单示例:http://plnkr.co/edit/Sm1T3rXkHNb04waFkkzG?p=preview
只需使用一个简单的ngIf
指令来控制window的打开/关闭状态。
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<button (click)="dialogOpen = true">Open Dialog</button>
<p>Status: {{ status }}</p>
<kendo-dialog title="Action required" (close)="onDecline()" *ngIf="dialogOpen">
<p>Do you accept?</p>
<kendo-dialog-actions>
<button kendoButton (click)="onAccept()">Yes</button>
<button kendoButton (click)="onDecline()">No</button>
</kendo-dialog-actions>
</kendo-dialog>
`
})
export class AppComponent {
public status = "not open";
dialogOpen : boolean = false;
public onAccept() { this.status = "accepted"; this.closeDialog(); }
public onDecline() { this.status = "declined"; this.closeDialog(); }
private closeDialog() {
this.dialogOpen = false;
}
}
我正在为 angular 2 尝试 kendo ui 并且关闭、单击事件似乎在 kendo 对话框中起作用。但是有打开和关闭对话框的方法吗?还是我必须为此使用 javascript?
此处为简单示例:http://plnkr.co/edit/Sm1T3rXkHNb04waFkkzG?p=preview
只需使用一个简单的ngIf
指令来控制window的打开/关闭状态。
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `
<button (click)="dialogOpen = true">Open Dialog</button>
<p>Status: {{ status }}</p>
<kendo-dialog title="Action required" (close)="onDecline()" *ngIf="dialogOpen">
<p>Do you accept?</p>
<kendo-dialog-actions>
<button kendoButton (click)="onAccept()">Yes</button>
<button kendoButton (click)="onDecline()">No</button>
</kendo-dialog-actions>
</kendo-dialog>
`
})
export class AppComponent {
public status = "not open";
dialogOpen : boolean = false;
public onAccept() { this.status = "accepted"; this.closeDialog(); }
public onDecline() { this.status = "declined"; this.closeDialog(); }
private closeDialog() {
this.dialogOpen = false;
}
}