剑道网格未在弹出窗口中显示
Posted
技术标签:
【中文标题】剑道网格未在弹出窗口中显示【英文标题】：kendo grid not displaying inside pop up 【发布时间】：2017-12-28 19:28:01 【问题描述】： 我是 Angular 2 和剑道 UI 的新手。 我正在尝试在弹出窗口中添加网格。 我能够显示弹出窗口。 但是当我添加网格时它没有显示。 你们能告诉我如何解决它吗？ 在控制台中，我也没有看到任何错误。 我正在尝试使用剑道 ui 显示弹出窗口。 http://demos.telerik.com/kendo-ui/grid/index示例工作代码http://jsfiddle.net/XY7HT/53/
在下面提供相关代码并在小提琴中提供完整代码，因为这里没有空间可以粘贴它https://jsfiddle.net/9bwdk6xk/4/
<div class="waterPaperDocInfo">
<span class="fa fa-file-text-o"></span>
<span class="cat" (click)="cloud();"> hat.paper paper</span> | Last Modified: hat.finger <span class="fa fa-clock-o">9:00 am</span>
</div>
<div id="win1" style="display:none">
<p>First Window</p>
<button type="button" id="open2">Open second Window</button>
<input type="file" name="batchFile" id="batchFile" title="Select file" />
<div id="grid"></div>
</div>
$("#grid").kendoGrid(
selectable: "multiple cell",
allowCopy: true,
columns: [
field: "productName" ,
field: "category"
],
dataSource: [
productName: "Tea", category: "Beverages" ,
productName: "Coffee", category: "Beverages" ,
productName: "Ham", category: "Food" ,
productName: "Bread", category: "Food"
]
);
【问题讨论】：
【参考方案1】：-
如果您使用带有 angular2 的 kendo ui。检查 kendo ui for angular 2 web 以获取组件指南here
至于 Angular 2，您希望如何添加组件基本步骤（检查 system.cofig.js 上的依赖关系，如果不可用，请先使用 npm 下载它-> 在 app/ng.module.ts 中添加模块 -> 在应用程序上使用它.component.ts)
这就是你在 mvvm way-ish (angular2) check this 中的做法，你使用的是 jquery-ish 方式。我不确定他们（剑道）是否希望你这样使用它，因为我没有看到他们在文档中以这种方式使用它。
只是我的意见，不要发布你所有的代码（对于 ppl 来说，至少我懒得读这些代码）
基本上在 ng.module.ts 上检查这一行，我正在导入网格、按钮和对话框，并将其添加到 @NgModule
import GridModule from '@progress/kendo-angular-grid';
import DialogModule from '@progress/kendo-angular-dialog'
import ButtonsModule from '@progress/kendo-angular-buttons';
@NgModule(
imports: [ BrowserModule, BrowserAnimationsModule, GridModule, DialogModule, ButtonsModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
)
然后你可以像这样使用它：
<kendo-dialog title="Kendo Dialog">
<kendo-grid [data]="gridData">
//your code goes here
</kendo-grid>
</kendo-dialog>
【讨论】：
感谢您的回复...我没看懂第二点...在小提琴jsfiddle.net/25va9nbw中提供system.config.js 可以告诉我是否已安装所有软件包 我认为您还没有将它包含在那个小提琴中。请看一下剑道的例子或我的 plunkr（你可以比较一下）。在其中您可以看到许多 kendo 依赖项被列出，例如 @progress/kendo-angular-dialog 等。请阅读更多 here 当我单击需要显示弹出窗口的文档时，我还有一个问题......那么我应该在 span 之后在哪里添加 kendo-dialog 标记？？ `以上是关于剑道网格未在弹出窗口中显示的主要内容，如果未能解决你的问题，请参考以下文章