我该如何做PrimeNG工作

我有一些麻烦安装PrimeNG正确地使用其富文本编辑器。我已经安装了所有我需要的东西，但它仍然无法正常工作。我该如何做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/[email protected]?main=browser"></script> 
    <script src="https://npmcdn.com/[email protected]"></script> 
    <script src="https://npmcdn.com/[email protected]/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>

所以我打电话{EditorModule, SharedModule}我的app.components.ts和我想看到这个组件的directives;

<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>

我到处搜索这个论坛，但无法弄清楚如何解决这个问题。有人可以提出建议吗？谢谢！

来源

2016-08-30 jiji

我有很多麻烦让事情像日历运行。我终于通过查看演示示例index.html并确保我加载了所有加载的脚本来解决此问题。有很多。 –

我有'index.html'他们提到的一切，我不知道为什么它仍然无法正常工作 – jiji

我在运行日历等事情时遇到了很多麻烦。我终于通过查看演示示例index.html并确保我加载了所有加载的脚本来解决此问题。有primeUI和jquery等有依赖关系。有很多：

<link id="themeStyleSheet" rel="stylesheet" type="text/css" href="vendor/primeui/themes/pepper-grinder/theme.css" /> 
    <link rel="stylesheet" type="text/css" href="vendor/primeui/primeui-ng-all.min.css" /> 
    <link rel="stylesheet" href="../app/app.css"> 

    <!-- 1. Load libraries --> 
    <!-- Polyfill(s) for older browsers --> 
    <script src="vendor/core-js/client/shim.min.js"></script> 
    <script src="vendor/zone.js/dist/zone.js"></script> 
    <script src="vendor/reflect-metadata/Reflect.js"></script> 
    <script src="vendor/systemjs/dist/system.src.js"></script> 

    <!-- sweet alert --> 
    <script src="vendor/ng2-sweetalert2/node_modules/sweetalert2/dist/sweetalert2.min.js"></script> 

    <!-- Datetimepicker, Slider, Schedule --> 
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-ui-timepicker-addon/1.6.1/jquery-ui-timepicker-addon.min.js"></script> 

    <!-- CodeHighligther --> 
    <script src="../app/resources/js/prism.js" data-manual></script> 

    <!-- Charts.js --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.6/Chart.bundle.min.js"></script> 

    <!-- Schedule --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.7.2/fullcalendar.min.js"></script> 

    <!-- InputMask --> 
    <script src="../app/resources/js/jquery.inputmask.bundle.js"></script>

来源

2016-08-30 14:07:42

我该如何做PrimeNG工作

回答

相关问题