Openmrs Form Render in Angular2 ?

naveed1228 · September 20, 2017, 5:24am

I am trying to render openmrs form through angular2 using dynamic form approach.Is there any other option for rendering openmrs form through Rest API using angular2?.Is there any built in library I can use to render the Openmrs form through Rest Api.

achachiez · September 20, 2017, 9:10am

Take a look at https://github.com/AMPATH/ng2-opemmrs-formentry you can use it as is or a least get and idea of how you can achieve it. The project is used here https://github.com/AMPATH/ng2-amrs let me know if anything is not clear.

naveed1228 · September 20, 2017, 9:31am

I clone it first and try to npm start but It does not compile.Any way I am looking for simple solution which openmrs provided us through Rest API.To get that form through Rest api and display it dynamiically in angular2.

naveed1228 · September 20, 2017, 10:33am

Here is error log file. http://pasted.co/b6db7b1f

naveed1228 · September 21, 2017, 7:57am

I installed and compile it successfully.What is the username and password for login?

achachiez · September 21, 2017, 9:14am

@naveed1228 in ng2-opemmrs-formentry the readme may be out of date

Clone

cd ng2-opemmrs-formentry
npm install
npm run build
cd demo
npm install
npm start

naveed1228 · September 21, 2017, 9:17am

I clone and npm install this one.

It run successfully but asking for credentials.What are credentials for login?

achachiez · September 21, 2017, 9:19am

That is just a form editor for our json schema it needs a connection to an openmrs instance

naveed1228 · September 21, 2017, 9:21am

how can I create that connection?I want to use openmrs form.Please provide me the step by step details how I can do that through Rest API using ampath?

achachiez · September 21, 2017, 9:24am

@naveed1228 Try to get ng2-opemmrs-formentry working first. Let me get some to help you further with the builder

naveed1228 · September 21, 2017, 9:25am

Ok I am working on this.

naveed1228 · September 21, 2017, 9:39am

After your provided steps.I get these error’s in console.

naveed1228 · September 21, 2017, 9:43am

error log! 0 info it worked if it ends with ok 1 verbose cli [ ‘C:\Program Files\nodejs\node.exe’, 1 verbose cli ‘C:\Users\Naveed\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js’, 1 verbose cli ‘start’ ] 2 info using npm@5.2.0 3 info using node@v6.11.1 4 verbose run-script [ ‘prestart’, ‘start’, ‘poststart’ ] 5 info lifecycle angular-library-seed-demo@~prestart: angular-library-seed-demo@ 6 verbose lifecycle angular-library-seed-demo@~prestart: unsafe-perm in lifecycle true 7 verbose lifecycle angular-library-seed-demo@~prestart: PATH: C:\Users\Naveed\AppData\Roaming\npm\node_modules\npm\bin\node-gyp-bin;C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo\node_modules.bin;C:\Users\Naveed\bin;C:\Program Files\Git2\mingw64\bin;C:\Program Files\Git2\usr\local\bin;C:\Program Files\Git2\usr\bin;C:\Program Files\Git2\usr\bin;C:\Program Files\Git2\mingw64\bin;C:\Program Files\Git2\usr\bin;C:\Users\Naveed\bin;C:\ProgramData\Oracle\Java\javapath;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files\MySQL\MySQL Utilities 1.6;C:\Program Files\Microsoft SQL Server\130\Tools\Binn;C:\Program Files\dotnet;C:\Program Files\Git2\cmd;C:\Dev\tools\apache-maven-3.5.0\bin;C:\Program Files\Java\jdk1.8.0_131\bin;C:\Program Files\nodejs;D:\SOFTWARES\Installed\Microsoft VS Code\bin;C:\Users\Naveed\AppData\Local\Microsoft\WindowsApps;C:\Users\Naveed\AppData\Roaming\npm;C:\Program Files\Git2\usr\bin\vendor_perl;C:\Program Files\Git2\usr\bin\core_perl 8 verbose lifecycle angular-library-seed-demo@~prestart: CWD: C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo 9 silly lifecycle angular-library-seed-demo@~prestart: Args: [ ‘/d /s /c’, ‘npm run clean:esm:jit && npm run copy-lib’ ] 10 silly lifecycle angular-library-seed-demo@~prestart: Returned: code: 0 signal: null 11 info lifecycle angular-library-seed-demo@~start: angular-library-seed-demo@ 12 verbose lifecycle angular-library-seed-demo@~start: unsafe-perm in lifecycle true 13 verbose lifecycle angular-library-seed-demo@~start: PATH: C:\Users\Naveed\AppData\Roaming\npm\node_modules\npm\bin\node-gyp-bin;C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo\node_modules.bin;C:\Users\Naveed\bin;C:\Program Files\Git2\mingw64\bin;C:\Program Files\Git2\usr\local\bin;C:\Program Files\Git2\usr\bin;C:\Program Files\Git2\usr\bin;C:\Program Files\Git2\mingw64\bin;C:\Program Files\Git2\usr\bin;C:\Users\Naveed\bin;C:\ProgramData\Oracle\Java\javapath;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files\MySQL\MySQL Utilities 1.6;C:\Program Files\Microsoft SQL Server\130\Tools\Binn;C:\Program Files\dotnet;C:\Program Files\Git2\cmd;C:\Dev\tools\apache-maven-3.5.0\bin;C:\Program Files\Java\jdk1.8.0_131\bin;C:\Program Files\nodejs;D:\SOFTWARES\Installed\Microsoft VS Code\bin;C:\Users\Naveed\AppData\Local\Microsoft\WindowsApps;C:\Users\Naveed\AppData\Roaming\npm;C:\Program Files\Git2\usr\bin\vendor_perl;C:\Program Files\Git2\usr\bin\core_perl 14 verbose lifecycle angular-library-seed-demo@~start: CWD: C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo 15 silly lifecycle angular-library-seed-demo@~start: Args: [ ‘/d /s /c’, 15 silly lifecycle ‘concurrently --raw “gulp copy-lib:watch” “webpack-dev-server --open --watch --config esm/webpack.config.js”’ ] 16 silly lifecycle angular-library-seed-demo@~start: Returned: code: 1 signal: null 17 info lifecycle angular-library-seed-demo@~start: Failed to exec start script 18 verbose stack Error: angular-library-seed-demo@ start: concurrently --raw "gulp copy-lib:watch" "webpack-dev-server --open --watch --config esm/webpack.config.js" 18 verbose stack Exit status 1 18 verbose stack at EventEmitter. (C:\Users\Naveed\AppData\Roaming\npm\node_modules\npm\lib\utils\lifecycle.js:289:16) 18 verbose stack at emitTwo (events.js:106:13) 18 verbose stack at EventEmitter.emit (events.js:191:7) 18 verbose stack at ChildProcess. (C:\Users\Naveed\AppData\Roaming\npm\node_modules\npm\lib\utils\spawn.js:40:14) 18 verbose stack at emitTwo (events.js:106:13) 18 verbose stack at ChildProcess.emit (events.js:191:7) 18 verbose stack at maybeClose (internal/child_process.js:891:16) 18 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5) 19 verbose pkgid angular-library-seed-demo@ 20 verbose cwd C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo 21 verbose Windows_NT 10.0.15063 22 verbose argv “C:\Program Files\nodejs\node.exe” “C:\Users\Naveed\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js” “start” 23 verbose node v6.11.1 24 verbose npm v5.2.0 25 error code ELIFECYCLE 26 error errno 1 27 error angular-library-seed-demo@ start: concurrently --raw "gulp copy-lib:watch" "webpack-dev-server --open --watch --config esm/webpack.config.js" 27 error Exit status 1 28 error Failed at the angular-library-seed-demo@ start script. 28 error This is probably not a problem with npm. There is likely additional logging output above. 29 verbose exit [ 1, true ]

naveed1228 · September 21, 2017, 10:22am

I solved the pUncaught Error: Cannot find module “…/…/lib” at webpackMissingModule (app.module.ts:7) at Object.236 (app.module.ts:7) at webpack_require (bootstrap 438d230cd115ecfb908a:54) at Object.227 (main-jit.ts:3) at webpack_require (bootstrap 438d230cd115ecfb908a:54) at Object.733 (main.js:702) at webpack_require (bootstrap 438d230cd115ecfb908a:54) at webpackJsonpCallback (bootstrap 438d230cd115ecfb908a:25) at main.js:1 client?a99e:155 [WDS] Errors while compiling. Reload prevented. msgErrors @ client?a99e:155 client?a99e:158 ./esm/src/app/app.module.ts Module not found: Error: Can’t resolve ‘…/…/lib’ in ‘C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo\esm\src\app’ @ ./esm/src/app/app.module.ts 15:12-32 @ ./esm/src/main-jit.ts @ multi (webpack)-dev-server/client?http://localhost:8090 ./esm/src/main-jit.ts msgErrors @ client?a99e:158 client?a99e:158 ./esm/src/app/app.component.css Module build failed: Error: No PostCSS Config found in: C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo\esm\src\app at Error (native) at C:\Users\Naveed\Desktop\Slack\ng2-opemmrs-formentry-master\demo\node_modules\postcss-load-config\index.js:51:26 @ ./esm/src/app/app.component.ts 185:21-51 @ ./esm/src/app/app.module.ts @ ./esm/src/main-jit.ts @ multi (webpack)-dev-server/client?http://localhost:8090 ./esm/src/main-jit.ts msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.component.ts:8:8 TS2307: Cannot find module ‘…/…/lib’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.component.ts:14:19 TS2304: Cannot find name ‘require’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.component.ts:15:22 TS2304: Cannot find name ‘require’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.component.ts:16:27 TS2304: Cannot find name ‘require’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.component.ts:20:13 TS2304: Cannot find name ‘require’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.component.ts:21:12 TS2304: Cannot find name ‘require’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.component.ts:23:14 TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the ‘experimentalDecorators’ option to remove this warning. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.module.ts:7:33 TS2307: Cannot find module ‘…/…/lib’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/app.module.ts:16:14 TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the ‘experimentalDecorators’ option to remove this warning. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/mock/mock-form.ts:1:35 TS2307: Cannot find module ‘…/…/…/lib/form-entry/question-models/text-input-question’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/mock/mock-form.ts:2:31 TS2307: Cannot find module ‘…/…/…/lib/form-entry/question-models/group-question’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/app/mock/mock-form.ts:3:35 TS2307: Cannot find module ‘…/…/…/lib/form-entry/question-models/repeating-question’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./esm/src/main-aot.ts:3:36 TS2307: Cannot find module ‘./app/app.module.ngfactory’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/common/src/directives/ng_class.d.ts:48:34 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/aot/compiler.d.ts:56:32 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/compile_metadata.d.ts:371:20 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/compile_metadata.d.ts:373:28 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/compile_metadata.d.ts:375:15 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/compile_metadata.d.ts:377:23 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/compile_metadata.d.ts:379:17 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/compile_metadata.d.ts:381:25 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/compiler/src/output/output_ast.d.ts:458:63 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/core/src/change_detection/differs/default_iterable_differ.d.ts:28:32 TS2304: Cannot find name ‘Iterable’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/core/src/change_detection/differs/default_keyvalue_differ.d.ts:24:16 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/core/src/change_detection/differs/default_keyvalue_differ.d.ts:32:16 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/core/src/change_detection/differs/iterable_differs.d.ts:15:48 TS2304: Cannot find name ‘Iterable’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/core/src/change_detection/differs/keyvalue_differs.d.ts:23:18 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/core/src/di/reflective_provider.d.ts:87:123 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/core/src/di/reflective_provider.d.ts:87:165 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/http/src/headers.d.ts:52:71 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/http/src/url_search_params.d.ts:46:16 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/platform-browser/src/browser/browser_adapter.d.ts:79:33 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/platform-browser/src/dom/dom_adapter.d.ts:97:42 TS2304: Cannot find name ‘Map’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/platform-browser/src/dom/shared_styles_host.d.ts:11:30 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/@angular/platform-browser/src/dom/shared_styles_host.d.ts:22:30 TS2304: Cannot find name ‘Set’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/rxjs/Observable.d.ts:58:60 TS2693: ‘Promise’ only refers to a type, but is being used as a value here. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./node_modules/rxjs/operator/toPromise.d.ts:3:79 TS2693: ‘Promise’ only refers to a type, but is being used as a value here. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./umd/app/app.component.ts:7:14 TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the ‘experimentalDecorators’ option to remove this warning. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./umd/app/app.module.ts:5:32 TS2307: Cannot find module ‘ticktock’. msgErrors @ client?a99e:158 client?a99e:158 [at-loader] ./umd/app/app.module.ts:12:14 TS1219: Experimental support for decorators is a feature that is subject to change in a future release. Set the ‘experimentalDecorators’ option to remove this warning. msgErrors @ client?a99e:158revious right now.I am getting this error.Can you help to solve it.

achachiez · September 21, 2017, 10:38am

What node version are you using

naveed1228 · September 21, 2017, 10:41am

I am using v6.11.1

naveed1228 · September 21, 2017, 10:44am

My npm version is 5.2.0?