【发布时间】:2017-01-06 20:35:45
【问题描述】:
我在正确安装PrimeNG 以使用其富文本编辑器时遇到了一些麻烦。我已经安装了我需要的所有东西,但它仍然无法正常工作。
这是我的package.json:
{
"name": "angular2-quickstart",
"version": "1.0.0",
"scripts": {
"start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ",
"lite": "lite-server",
"postinstall": "typings install",
"tsc": "tsc",
"tsc:w": "tsc -w",
"typings": "typings"
},
"license": "ISC",
"dependencies": {
"@angular/common": "2.0.0-rc.1",
"@angular/compiler": "2.0.0-rc.1",
"@angular/core": "2.0.0-rc.1",
"@angular/forms": "0.3.0",
"@angular/http": "2.0.0-rc.1",
"@angular/platform-browser": "2.0.0-rc.1",
"@angular/platform-browser-dynamic": "2.0.0-rc.1",
"@angular/router": "2.0.0-rc.1",
"@angular/router-deprecated": "2.0.0-rc.1",
"@angular/upgrade": "2.0.0-rc.1",
"angular2-in-memory-web-api": "0.0.11",
"bootstrap": "^3.3.6",
"core-js": "^2.4.0",
"lodash": "^4.15.0",
"ng2-dropdown": "0.0.12",
"primeng": "^1.0.0-beta.13",
"primeui": "^4.1.15",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.6",
"systemjs": "0.19.27",
"zone.js": "^0.6.12"
},
"devDependencies": {
"concurrently": "^2.0.0",
"lite-server": "^2.2.0",
"typescript": "^1.8.10",
"typings": "^1.0.4"
}
}
我的typings.json:
{
"globalDependencies": {
"core-js": "registry:dt/core-js#0.0.0+20160317120654",
"jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
"node": "registry:dt/node#4.0.0+20160509154515"
},
"dependencies": {
"lodash": "registry:npm/lodash#4.0.0+20160723033700"
}
}
我的index.html:
<!DOCTYPE html>
<html>
<head>
<script>document.write('<base href="' + document.location + '" />');</script>
<title>My page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="node_modules/primeui/themes/omega/theme.css" />
<link rel="stylesheet" type="text/css" href="node_modules/primeui/primeui-ng-all.min.css" />
<link rel="stylesheet" href="/assets/css/styles.css">
<!-- Polyfill(s) for older browsers -->
<script src="https://npmcdn.com/core-js/client/shim.min.js"></script>
<script src="https://npmcdn.com/zone.js@0.6.12?main=browser"></script>
<script src="https://npmcdn.com/reflect-metadata@0.1.3"></script>
<script src="https://npmcdn.com/systemjs@0.19.27/dist/system.src.js"></script>
<script src="node_modules/primeui/primeui-ng-all.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('./app').catch(function(err){ console.error(err); });
</script>
</head>
<body>
<my-app>Loading...</my-app>
</body>
</html>
所以我在我的app.components.ts 和我想看到的组件的directives 中调用了{EditorModule, SharedModule};
<p-editor [style]="{'height':'320px'}">
<header>
<span class="ql-format-group">
<span title="Bold" class="ql-format-button ql-bold"></span>
<span class="ql-format-separator"></span>
<span title="Italic" class="ql-format-button ql-italic"></span>
<span class="ql-format-separator"></span>
<span title="Underline" class="ql-format-button ql-underline"></span>
<span class="ql-format-separator"></span>
<span title="Strikethrough" class="ql-format-button ql-strike"></span>
</span>
</header>
</p-editor>
我在这个论坛上到处搜索,但不知道如何解决这个问题。有人可以提出任何建议吗?谢谢!
【问题讨论】:
-
我在运行日历等事情时遇到了很多麻烦。我终于通过查看演示示例 index.html 并确保我正在加载它们加载的所有脚本来解决它。有很多。
-
我有他们提到的
index.html中的所有内容,我不知道为什么它仍然不起作用
标签: html json twitter-bootstrap angular typescript