I am having trouble using ng commands but npm commands are working.

While doing ng serve on angular2-seed project. Below message is getting displayed.
you have to be inside and angular-cli project in order to use the serve command.

I tried below but it didn't work.
npm uninstall -g @angular/cli
npm cache clean
npm install -g @angular/[email protected]

Hi again, usually this happens when you are outside the project folder. the command should be executed under folder angular2-seed/ng2angle
Is that your case?

Btw, using version 1.0.0 is recommended for the moment until next update.


I am inside the ng2angle folder and doing ng serve.

also, checking the ng --version "strange why it is not reflecting 1.0.0" even after installing globally as mentioned above.
angular-cli: 0.1.0
node: 6.11.1
os: win32 x64

Did you face similar problem or know any solution ?

I was able to resolve the issue. Thanks.
Great! Thanks for the feedback.

freedraw PURCHASED
I see that you have MVC5/6 with AngularJS as one of the versions available. Is that true? I am looking for a VS project that runs on combination of MVC and AngularJS. I would like to confirm before I commit to buy your template.

Thank you!
Hi, that's right, we have version for MVC5+angular and MVC6+angular, both based on angular 1.x
and another with netcore+angular2 (actually v4)
MVC5 is currently based on VS2013 and MVC6/netcore uses VS2015
Next version, we expect to release by the end of september, includes all projects migrated to VS2017

Please let us know if you have any question or need further details.
freedraw PURCHASED
I just purchased your template. Thanks for your help!
We are having problems with Toast notification in Angular 4 template. If we try to show notification on top position, it appears behind the navtop bar. We guess the proper way to implement this is include toaster container en Layout Module, unfortunatelly we are getting the following error "No Toaster Containers have been initialized to receive toasts".

Please could you guide to find a solution?
Hello, this is a solution we shared with another user previously.
As you mentioned, to solve this is necessary to move the toaster-container into a more global location so toasters are not affected by the stack context.

1-.Add at the bottom of app/layout/layout.component.html
<toaster-container [toasterconfig]="toasterconfig"></toaster-container>
2- Import toaster into the LayoutModule in app/layout/layout.module.ts
import { ToasterModule, ToasterService } from 'angular2-toaster/angular2-toaster';
imports: [
providers: [
2- In the Layout component create config with the values you want (app/layout/layout.component.ts)
import { ToasterConfig } from 'angular2-toaster/angular2-toaster';
toasterconfig: ToasterConfig = new ToasterConfig({
positionClass: 'toast-bottom-right',
showCloseButton: true

4- Finally, remove any reference from SharedModule to avoid issue with the toaster service.

We know Toaster is more useful when there's not conflict in the usage, but since not everyone uses Toaster we tried to avoid bloating the main components with features that are not related with the main usage.

Please let us know if you have any question or need help implementing this.

I have been developing an application with your netcore/angular project and occasionally when I build in dev I get this: https://imgur.com/4sI5UP7. Other times it builds fine. Im not sure but might have to do with network speeds... Some days takes me 4 or 5 builds to get it running after clearing browsing and computer restart.

The project Im using was a release from around June-July, currently with [email protected] If you have any solution please advise.

Hi, the webpackJsonp issue, from what we consider, it happens when the main bundle is being regenerated and the reload is not performed at the right time, sometimes depending on the code that is updated is could take more or less time. Meaning, is not the same changing a variable value than the place a module is imported. Anyway, we see this message very rarely from time to time. Found also it's an old issue with webpack (https://github.com/webpack/webpack/issues/368) but tried different approach from users without luck and also the fact that it seems to be a bit "random" makes hard to test.
In the next release we will moving to VS2017 and update all dependencies, hopefully we can get rid of this issue using a newer version.
We'll back to this comment in case we found any workaround.


I found a workaround for this. When it occurs it only happens on the url 'http://localhost:2321' (or w/e port) but if you just navigate away from it to your home url such as 'http://localhost:2321/home' it will load the application fine.
when is available for bootstrap 4?

Thanks so much
Hi, we have in plans an update to Bootstrap 4 but right now we don't have an ETA.

Using netcore/angular project, when I initiate a swal Alert with a CONFIRM function it breaks the tab navigation of the entire website once it is clicked. I was also able to reproduce this on your example Ng2angle Elements > Alerts section; same behavior (tested in CHROME 60).

Do you have any solution to this?

Hi, we couldn't replicate the issue. We tested the demo and seems to work fine but we assume you have a custom invocation code, if so, could you post the code so we can test exactly that case?

Thank you
I just tested in all browsers and its definitely reproducible. Go to http://themicon.co/theme/angle/v3.7.5/angular2/elements/sweetalert > click 'A warning message, with a function attached to the "Confirm"-button' > Confirm > back to page without tabbing working. I don't have any custom invocation code; I use the swals as they are used in the demos.
Thanks, misunderstood the issue. After checking it for a possible workaround we found this post on the SweetAlert repo, https://github.com/t4t5/sweetalert/issues/127#issuecomment-271753754
We have implemented the workaround in the constructor of the component and seems to work fine, at least until the plugin is fixed:

constructor() {

const close = (<any>window).swal.close;
const previousWindowKeyDown = window.onkeydown;
(<any>window).swal.close = function() {
window.onkeydown = previousWindowKeyDown;


In each constructor of components using swal?
Yes, it should be added on any constructor because is necessary to override every instance of swal imported. Optionally, to make this more appropriate and to avoid duplicate of code, you can try creating a service that provides access to a unique "swal" instance, this way you will setup the "close" function only once.

Btw, after checking code again, you can remove the "window" reference and use just the swal variable.

const close = swal.close;
const previousWindowKeyDown = window.onkeydown;
swal.close = function() {
window.onkeydown = previousWindowKeyDown;

Thanks - it worked.
After building and launching on localhost my left side bar contains only "Home".
What I did wrong?
Hello, it could be possible you are using a seed version? We include a full-features version and seed version of each project.
Main difference is that the seed only has one route and a few dependencies. The purpose of the seed project is to provide a starter project where you can go adding more features progressively. In other words, if you use the full project, you can customize it by removing features, if using the seed, you can customize it by adding features.

Thank you!
I really used the seed version. But now the question is how to properly add components and features to the seed version? For example from Elements subtree. I tried to modify menu.ts and simple copy ng2angle\src\app\routes\elements\ from full version to seed but there is an error.
Hi, to add more feature to a seed project, for example, the Tree component requires to import the plugin files into the app and sometime a few styles that customizes the plugin defaults.
In file src/app/routes/elements/elements.module.ts you will see all imported plugins and components used in in the elements modules, which corresponds to menu items under "Elements"
The line import { TreeModule } from 'angular-tree-component';
import the plugin module and then is included into the app using the @NgModule decorator

After adding the module and components, it's necessary a menu entry and route, you can use as a reference the files menu.ts and routes.ts

Hi! Thanks for your replies :)

When I remove <preloader> from index.html — vertical scroll doesn't work any more, it dissapears...
solved the problem by myself

because of line in preloader.js
body.style.overflow = 'hidden';
greg5150 PURCHASED
Great template!
I'm using the NetCoreAngular2 version and I'd like to know how to prevent the router-outlet content from scrolling to the top when the app-offsidebar is opened.
I have a page that is very long and has many ng2-dnd drop elements. The page also has buttons throughout and when they are clicked, the offsidebar is opened and contains drag elements to pull to the main content. The problem is that when a button is clicked, the offsidebar opens with my drag elements, but I lose my place on the page and have to scroll back down to find it.
Thanks for any help.
Hi, please try the following fix.
- Open file src/app/shared/styles/app/offsidebar.scss
- Go to line ~ 76
- You will see the rule for .offsidebar-open, there remove the media query

// @media only screen and (min-width: $mq-tablet) {
// overflow-y: auto;
// }

- Compile and load again.

Let us know if you have any question

I am trying the purchased template. reactjs

npm start

ERROR in ./app/Vendor.jsx
Module not found: Error: Can't resolve '../bower_components/modernizr/modernizr.custom.js'

and more like this..

Could you help me?

THank you
Hi, it seems bower dependencies were not installed. Please try running "bower install" and then run the project again.

rdheepan PURCHASED
Angular Project
Do you have any idea of integrating any of the following in the template?

1. State management libraries like Redux / Ngrx...
2. Documentation libraries like compodoc / xyz..

I understand that they are user's choice and they differ from project to project. But in case if that's in your plan, i could wait for the release otherwise start with my own.
Hi, unfortunately for the moment we don't plans to integrate redux or compodoc and we haven't used them before.
Anyway, we will check both projects in a future release for Angular4 project but angular 1.x will be receiving less frequent updates and big changes.

Let us know if you have any question
It seems that , if we install the meanjs version under ubuntu 17 and node 8.5.0 , we can't launch properly 'npm install' whithout some compilation error.

When do you think you will upgrade meanjs version ? The 0.6.0 is comming
Hi, could you post the log message? You can use pastebin.com if it's too long.
Currently the version 0.4.x is marked as stable, 0.5 is latest release that we pretend to upgrade soon as it become stable. The main reason is that we want to support the more close to production ready versions.
Any chance you could try with node 6.x ?

How do I get the update? the version I have is 3.3.1 12/03/2016 thank you
Hi, you should receive an email from Wrapbootstrap every time we release a new version. To get the last release, please use the download resender:

Let us know if you have any quesiton
Do you think you will design a single page landing page to be used as a frontend?

Hello, the landing page included is the one you can see when open the live preview.
The landing page is a jQuery based project, it's not written using another framework like angular2. This is done this way because usually the landing page is a presentation page and should be lightweight as possible, then when a user decides to use the app, the user is redirected to the url where the angular app is placed.

Please let us know if you have any question
Hi, I want to do the following datatable or grid with React
a) I want to add a row on a button click-> Add rows. Each row may contain a list of values in drop down or in radio button list. When I add a row, the respective columns should be rendered.

2) on preload of the data table ( or grid), can i have the predefined number of rows set and rendered while the control gets displayed.

I have not tried to this level and not sure these exist. Hence the information is needed.

a) Please see DT documentation here to add rows dynamically: https://datatables.net/examples/api/add_row.html
b) Not sure about this. Do you want to show rows as a placeholder while data is rendered and then replace those rows with the one with real information?

Hi, thanks for your comments. I will go through the documentation .
There are 2 scenarios:
1) Regarding the pre-loading with rows, say I know there are 5 records in the db table which had been done in the previous transactions and I want the user to come to this page wherein it prefetches all the 5 records plus allowing the user to add/edit rows.

2) When the user comes to specific page, I know the user is going , for e.g., to add a minimum of 2 rows so I want 2 records in the tabale/grid to be pre-created so that when the user submit, both the rows could be saved. Here again, the user is allowed to add more records to the table/grid over and above the 2 records which were predefined.

Hi Team,

We have recently purchased this theme for ng2angle application. But we are unable to run it successfully. Below are the issues detail which we are facing.

Local Version:
@angular/cli: 1.0.0
node: 6.9.1
os: linux x64
@angular/animations: 4.0.2
@angular/common: 4.0.2
@angular/compiler: 4.0.2
@angular/core: 4.0.2
@angular/forms: 4.0.2
@angular/http: 4.0.2
@angular/platform-browser: 4.0.2
@angular/platform-browser-dynamic: 4.0.2
@angular/router: 4.0.2
@angular/cli: 1.0.0
@angular/compiler-cli: 4.0.2

Global Version:
@angular/cli: 1.3.2
node: 6.9.1
os: linux x64

Node : v6.9.1
NPM : 3.10.8

Error :
ERROR in multi script-loader!./~/jquery/dist/jquery.js script-loader!./src/app/core/preloader/preloader.js script-loader!./~/flot/jquery.flot.js script-loader!./~/jquery.flot.tooltip/js/jquery.flot.tooltip.js script-loader!./~/flot/jquery.flot.resize.js script-loader!./~/flot/jquery.flot.pie.js script-loader!./~/flot/jquery.flot.time.js script-loader!./~/flot/jquery.flot.categories.js script-loader!./~/jquery.flot.spline/jquery.flot.spline.js script-loader!./~/jquery-sparkline/jquery.sparkline.js script-loader!./~/easy-pie-chart/dist/easypiechart.js script-loader!./~/chart.js/dist/Chart.bundle.js script-loader!./~/jqcloud2/dist/jqcloud.js script-loader!./~/bootstrap/js/modal.js script-loader!./~/bootstrap/js/dropdown.js script-loader!./~/bootstrap/js/tooltip.js script-loader!./~/summernote/dist/summernote.js script-loader!./~/moment/min/moment-with-locales.min.js script-loader!./~/fullcalendar/dist/fullcalendar.js
Module not found: Error: Can't resolve '/home/ar.kumar/projects/adscash/adscash-exchange-apis/ng2angle/node_modules/flot/jquery.flot.js' in '/home/ar.kumar/projects/adscash/adscash-exchange-apis/ng2angle'

Please revert ASAP.

Hi, please try running the install with the following command
Remove node_modules folder before install again.

> npm install --unsafe-perm

If above doesn't work, please try this solution, it worked for other users with the same error and will be also applied in next release:

In package.json, find an entry named "napa"; add there the following line:

"flot": "flot/flot#v0.8.3"

Then, remove any other reference to "flot" from entry "dependencies" (to avoid problems with duplicate installation)
Install again with "npm install"

Alternative way to install is to use "yarn" instead of npm.

Let us know if you have any question

In angular template, you recommend running "ng build --prod --no-sourcemap --aot" for building the solution. In production we are getting warnings in chrome dev console: "DevTools failed to parse SourceMap:..." Is that a problem? Should we compile source maps?

Thanks in advance.
Hi, the "no-sourcemap" flag should work, it corresponds to version 1.0.0 of the template.
What version of @angular/cli are you using? You can check it with command "ng --version"
If it's newer than 1.0.0 please try the following:
> npm uninstall -g @angular/cli
> npm install -g @angular/[email protected]
Then try build again

If you already have 1.0.0, have you installed any other plugin into the project? Do you see the same messages in demo? Which page?

gandarez PURCHASED
I found a small "bug"

Line 54 of chart-flot.scss must be changed from id to class identifier -> .flotTip yo get tooltip working on flotchartjs.
Hi, thank you1 We'll check this for next update

Hola, estoy muy interesado en comprar tu plantilla, la revise y me encanta, solo quiero saber que diferencia hay entre la que vale $24, $100 y $900
Hello, I am very interested in buying your template, check it out and I love it, I just want to know what difference there is between the $ 24, $ 100 and $ 900
Hi, there are different prices for different usage licenses, here it's important the purpose of your project. If you will use the template for one project for one client, Single License is Ok.
The Multiple license is similar to Single, but consider it as a volume discount. If in the future you decide the template will fit for many of your projects, let say more than 3 projects for example, Multiple license will be better for you.
Extended license only applies when your project is created for more than one client, and all those clients are charged for the use of your end product, being a service or another product for resell.
Regarding to versions included, the product "Angle" comes adapted to different framework, but it's only one product so the chosen license applies only for one project you decide to use.

Let us know if you have any question
We are using the dotnet core angular 2 project. The demo shows Carousel under elements, but we cannot find it in the downloaded file?

If its not there, do u recommend any carousel control for angular 2

Hi, the netcore-angular2 project is the same Angular project you can see here http://themicon.co/theme/angle/v3.7.5/angular2/ but ported to a VS environment. This project doesn't have an extra carousel feature more than the one provided by bootstrap.
For Carousel we don't have any special recommendation, meaning, we can not offer more than we can find on google and it could be better that you chose a carousel according to your project needs.
If you can 't find any ng2 native carousel you might try to use a jquery carousel and then using a component wrapper you can start and use the plugin. In component blog/articleview you can see an example of using a component as wrapper of a plugin, summernote in this case.

Hello. I am having problems to run the angular 4 version.
After "npm install" and then "ng serve", i get this:

Cannot read property 'config' of null.

Can you help me?
Hi, check you have the file .angular-cli.json in your project. If not present, please check to see hidden files or review the zip package to extract the file.
Usually that error message is related with the missing configuration file, .angular-cli.json

Thanks for the response. Are you planning any updates soon? I am working on a project that use karma and e2e tests, but the angular cli is old by now. Is it possible to update without problems? I think I will have to wait for an update, right?
Hi, yes we are planning to update to soon, actually we are delayed with the last release should be landing anytime soon before mid October.
We have the ng4 project updated but due to delay we need to perform another update before release (cli updates are really very frequent)
We suggest you to wait for the update because some changes in the cli might result in problem compiling the actual code. Anyway, in order to provide a quick assistance, please contact us again next week and we will try to send you the updated project files (before release)


Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase


Licenses: Details »

Single application $28
  • HTML Template
Bootstrap: Compatible with 4.x
  • Responsive
  • Fluid
  • Fixed-width
  • IE 10, 11
  • Latest Chrome
  • Latest Edge
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:Yes
Topic: Internet & Web
Labels: admin, admin template, angularjs, material, meanjs, meteor, mvc, rails, responsive, rtl
Released:4 years ago
Updated:3 months ago
Sold exclusively on WrapBootstrap


Signed up 4 years ago

Need a front-end template?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running:

  • Responsive 12-column grid
  • 12 custom, modular jQuery plugins
  • CSS styles for forms, navigation & more
  • Dozens of reusable components
  • Components are scaled according to a range of resolutions and devices
  • Built with Sass (CSS included)
  • Complete styleguide documentation