使用AngularJS创建一个简单的KendoUI下拉列表。没有看到正确样式的下拉。
这是html ......
<div ng-controller="welcome2 as vm">
<select kendo-drop-down-list k-options="vm.phoneOptions"></select>
</div>
js文件:
(function () {
'use strict';
angular.module('app')
.controller('welcome3',
[welcome3]);
function welcome3() {
var vm = this;
vm.activate = activate;
activate();
function activate() {
vm.phoneOptions = {
dataSource: {
data: [
{name: "iPhone"},
{name: "Droid"},
{name: "Windows"}
]
},
dataTextField: "name",
dataValueField: "id",
optionLabel: "Select a phone..."
};
}
}
})();
在index.js文件中,我有(除其他外)以下内容:
<!DOCTYPE html>
<html ng-app="app">
<head lang="en">
<meta charset="UTF-8">
<link href="content/bootstrap.css" rel="stylesheet" />
<link href="content/kendo.common.min.css" rel="stylesheet" />
<link href="content/kendo.default.min.css" rel="stylesheet.css" />
</head>
<body>
// ...
<div ng-view></div>
<script src="scripts/jquery.min.js"></script>
<script src="scripts/angular.js"></script>
<script src="scripts/angular-route.js"></script>
<script src="scripts/kendo.all.min.js"></script>
<script src="scripts/angular-kendo.js"></script>
//....
<script src="app/welcome/welcome3.js"></script>
</body>
</html>
下拉列表如下所示:
与此相反:
谢谢!
答案 0 :(得分:1)
通常当你有这样的无风格控件时,这是因为你的样式表链接错误。看起来common
文件链接正确,但检查另一个。此外,使用Bootstrap时,请务必使用common-bootstrap
CSS文件。