Angular2打字稿 - kendo ui網格欄模板（單擊）不起作用

我是Angular的新手，不明白ng-if和（click）事件爲什麼不能在kendo網格欄模板中工作。Angular2打字稿 - kendo ui網格欄模板（單擊）不起作用

我想要一個按鈕，需要有條件地可見，並點擊我需要導航到其他頁面在水療中心。使用命令我無法動態處理基於單元值的可視性。所以，選擇了模板，但模板點擊事件不起作用。

這裏是我的組件：

import { Component, Output, Input } from '@angular/core'; 
import { ReplaySubject } from 'rxjs/Rx'; 
import { ROUTER_DIRECTIVES, Router } from '@angular/router-deprecated'; 

import { TWCGridComponent, PanelComponent } from 'infrastructure.export'; 
import { IssueDTO } from 'issue.webmodel.export'; 

import { IssueBusinessService } from '../../webBL/issue.business.service'; 

declare var $: any, moment: any; 

@Component({ 
selector: 'twc-issue-list', 

templateUrl:     'webApp/issueDetail/Shared/sections/issueList/issue.list.template.html', 
directives: [ROUTER_DIRECTIVES, TWCGridComponent, PanelComponent], 
viewProviders: [], 
styles: [` 
    :host { display: block; } 
`] 
}) 

export class IssueListComponent { 
dataSource: Array<IssueDTO> = []; 
gridOptions: kendo.ui.GridOptions; 
child: JQuery; 
// private $el: JQuery; 
@Output() knownIssuesCount: ReplaySubject<{}> = new ReplaySubject(1); 
@Input() set searchParams(params: any) { 
    if (params) { 
     this.initSearch(params); 
    } 
} 
constructor(private issueBusinessService: IssueBusinessService, 
    private router: Router 
) { 
    this.gridOptions = { 
     sortable: false, 
     scrollable: false, 
     columns: [ 
      { 
       field: "id", title: "Issue ID/Status/Summary", width: "40%", 
       template: ` 
        <div class="cellLine">#:id# \/ <span class='status #:statusName.toLowerCase().replace(/ /g, '')#'>#:statusName.toUpperCase()#</span></div> 
        <div class="cellLine">#:title#</div>` 
      }, 
      { 
       field: "category", title: "Category/Type", width: "30%", 
       template: ` 
        <div class="cellLine">#:primaryIssueCategoryName#</div> 
        <div class="cellLine">#:primaryIssueCategoryTypeName#</div> 
       ` 
      }, 
      { 
       field: "updateTime", title: "Created/Updated", width: "20%", 
       template: this.gridFormatters.lastUpdate 
      }, 
      { 
       field: "command", hidden: false,     
       template: `<div><button type="button" onclick="toggleOrder()" class='btn btn-rounded #:readAllowed# icon-twc-08'</button></div>`     
    }; 
    /* tslint:disable */ 
    function toggleOrder() { 
     alert("hey"); 
    } 
    /* tslint:enable */  
} 
toggleOrder() { 
    alert("hey"); 
} 
}

來源

2016-09-14 Shwetha

你需要使用（點擊）= 「點擊（）」，我沒有看到一個* ngIf在你的代碼。事件名稱周圍的「（）」告訴angular2其事件。

來源

2016-09-14 14:59:08

嗨，約翰，感謝您的回答，但（點擊）事件沒有觸及組件內部的方法toggleOrder（）。我試過

。 ngif和（click）事件都不起作用。但是當我寫onclick =「alert（hello）」它確實工作，所以我想知道爲什麼HTML onclcik工作，但角度（點擊）事件是從劍道網格的列模板識別。 – Shwetha

Angular2打字稿 - kendo ui網格欄模板（單擊）不起作用

回答

相關問題