After doing: npm install
I get the following:

Projects\CoreUI-Free-Bootstrap-Admin-Template\Angular2_Dev>npm start

> [email protected] start ..\Projects\CoreUI-Free-Bootstrap-Admin-Template\Angular2_Dev
> tsc && concurrently "tsc -w" "lite-server"

app/widgets/widgets.component.ts(360,9): error TS1005: ',' expected.

I changed the file widgets.component.ts file:

elements: { point: { radius: 0 } },
        legend: {
            display: false
        }
};

Now, I did npm start again and I get:

> [email protected] start \Projects\CoreUI-Free-Bootstrap-Admin-Template\Angular2_Dev
> tsc && concurrently "tsc -w" "lite-server"

app/layouts/full-layout.component.ts(3,10): error TS2305: Module '"/Projects/CoreUI-Free-Bootstrap-Admin-Template/Angular2_Dev/node_modules/ng2-bootstrap/ng2-bootstrap"' has no exported member 'DROPDOWN_DIRECTIVES'.
app/layouts/full-layout.component.ts(4,10): error TS2305: Module '"/Projects/CoreUI-Free-Bootstrap-Admin-Template/Angular2_Dev/node_modules/ng2-bootstrap/ng2-bootstrap"' has no exported member 'TAB_DIRECTIVES'.
node_modules/ng2-bootstrap/components/utils/components-helper.service.d.ts(45,45): error TS2315: Type 'Type' is not generic.
node_modules/ng2-bootstrap/components/utils/components-helper.service.d.ts(56,41): error TS2315: Type 'Type' is not generic.
app/app.module.ts(5,10): error TS2305: Module '"/Projects/CoreUI-Free-Bootstrap-Admin-Template/Angular2_Dev/node_modules/ng2-bootstrap/ng2-bootstrap"' has no exported member 'DROPDOWN_DIRECTIVES'.

I'm using the Angular2 CLI Starter.

There is

/src/img/
/src/assets/img/

Both folders have favicons and logos.

Hi!
First of all let me say thank you very much for your hard work, I really like the framework.
I'm having problems with the chart widgets, it is cutting off the tooltip when it reaches the edge of the card. I wonder if we need to add an overflow: visible somewhere... need help figuring it out!
Thanks!

Hi!
This is a very interesting project, it would be nice to have a version of it in vuejs http://vuejs.org

The app has been working great for 2 weeks then last night I updated my OSX to Sierra. Everything worked this morning till I decided to update my angular-cli to 1.0.0-beta.16. At thi spoint the app broke and was giving me errors when trying to load images to the page from the assets folder.

I spent hours confirming files were indeed in the correct path and then rolled back my version of angular-cli, node, and npm to many different versions and combinations to clear the problem.

At this point I cleared the original errors but instead of getting the app to load now it gives me a new set of errors. It appears it has to do with the ng-charts the dashboard is using. I have not changed anything from the original code on the dashboard. I uninstalled node and npm from my machine and reinstalled it to latest. I cloned a new version of CoreUI-Free-Bootstrap-Admin-Template and npm installed it with

angular-cli: 1.0.0-beta.17
node: 6.7.0
os: darwin x64
npm: 3.10.3

But at this point I am still dealing with the problem pertaining to ng-charts. Any help or ideas on what I can do from here would be appreciated. I have been hacking away at these errors for 12 hours today and I am out of troubleshooting ideas. Reinstalling the app and getting the same errors as my app that has been in development for 2 weeks tells me that it has to do with the most updated versions of node npm and angular-cli breaking with the code in the CoreUI Template.

Here is a chunk of my error log.

zone.js:355Unhandled Promise rejection: Template parse errors:
Can't bind to 'datasets' since it isn't a known property of 'base-chart'.

1. If 'base-chart' is an Angular component and it has 'datasets' input, then verify that it is part of this module.
2. If 'base-chart' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.
   ("iv>
   
   
   <base-chart class="chart" [ERROR ->][datasets]="lineChart1Data" [labels]="lineChart1Labels" [options]="lineChart1Options" [colors]="lineC"): DashboardComponent@19:46
   Can't bind to 'labels' since it isn't a known property of 'base-chart'.
3. If 'base-chart' is an Angular component and it has 'labels' input, then verify that it is part of this module.
4. If 'base-chart' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.
   ("ss="chart-wrapper p-x-1">
   <base-chart class="chart" [datasets]="lineChart1Data" [ERROR ->][labels]="lineChart1Labels" [options]="lineChart1Options" [colors]="lineChart1Colours" [legend]="line"): DashboardComponent@19:74
   Can't bind to 'options' since it isn't a known property of 'base-chart'.
5. If 'base-chart' is an Angular component and it has 'options' input, then verify that it is part of this module.
6. If 'base-chart' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.
   (" <base-chart class="chart" [datasets]="lineChart1Data" [labels]="lineChart1Labels" [ERROR ->][options]="lineChart1Options" [colors]="lineChart1Colours" [legend]="lineChart1Legend" [chartType]="l"): DashboardComponent@19:102
   Can't bind to 'colors' since it isn't a known property of 'base-chart'.
7. If 'base-chart' is an Angular component and it has 'colors' input, then verify that it is part of this module.
8. If 'base-chart' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.
   ("class="chart" [datasets]="lineChart1Data" [labels]="lineChart1Labels" [options]="lineChart1Options" [ERROR ->][colors]="lineChart1Colours" [legend]="lineChart1Legend" [chartType]="lineChart1Type" (chartHover)="c"): DashboardComponent@19:132
   Can't bind to 'legend' since it isn't a known property of 'base-chart'.
9. If 'base-chart' is an Angular component and it has 'legend' input, then verify that it is part of this module.
10. If 'base-chart' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.
    ("eChart1Data" [labels]="lineChart1Labels" [options]="lineChart1Options" [colors]="lineChart1Colours" [ERROR ->][legend]="lineChart1Legend" [chartType]="lineChart1Type" (chartHover)="chartHovered($event)" (chartCl"): DashboardComponent@19:161
    Can't bind to 'chartType' since it isn't a known property of 'base-chart'.
11. If 'base-chart' is an Angular component and it has 'chartType' input, then verify that it is part of this module.
12. If 'base-chart' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.
    ("hart1Labels" [options]="lineChart1Options" [colors]="lineChart1Colours" [legend]="lineChart1Legend" [ERROR ->][chartType]="lineChart1Type" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"
    "): DashboardComponent@19:189

Link is in last section here.

CoreUI is really fine, btw, kudos.

Loving the theme and wondering if it can also be distributed as an NPM package?

Is multiple select broken?

I watched it in Angular2_Dev running it locally, but also in the web's examples.

Have you considered to include the multiple select from ng2-select?

Instead of the actual one?:

app.js

1. ajax get
   2.$.load

function loadPage(url) {
    $.ajax({
        type : 'GET',
        url : $.subPagesDirectory + url,
        dataType : 'html',
        cache : false,  //no cache
        async: false,   // sync
        beforeSend : function() {
            $.mainContent.css({ opacity : 0 });
        },
        success : function() {
            Pace.restart();
            $('html, body').animate({ scrollTop: 0 }, 0);
            $.mainContent.load($.subPagesDirectory + url, null, function (responseText) {
                window.location.hash = url;
            }).delay(250).animate({ opacity : 1 }, 0);
        },
        error : function() {
            window.location.href = $.page404;
        }

    });
}

Hi Team,

I am trying to integrate this Project with Maven build and I have included all the Node Modules mentioned too. Getting the below error. Please help

zone.js:355 Unhandled Promise rejection: Template parse errors:
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("v">

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/dashboard']"> Dashboard N"): FullLayoutComponent@44:73
  Can't bind to 'routerlink' since it isn't a known property of 'a'. ("s="nav-dropdown-items">
  
• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/buttons']"> Buttons

<li clas"): FullLayoutComponent@49:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("> Buttons

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/social-buttons']"> Social Buttons

"): FullLayoutComponent@50:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("ocial Buttons

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/cards']"> Cards

<li class="n"): FullLayoutComponent@51:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("e"> Cards

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/forms']"> Forms

<li class="n"): FullLayoutComponent@52:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("e"> Forms

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/switches']"> Switches

<li cl"): FullLayoutComponent@53:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. (" Switches

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/tables']"> Tables

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/dashboard']"> Dashboard N"): FullLayoutComponent@44:73
  Can't bind to 'routerlink' since it isn't a known property of 'a'. ("s="nav-dropdown-items">
  
• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/buttons']"> Buttons

<li clas"): FullLayoutComponent@49:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("> Buttons

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/social-buttons']"> Social Buttons

"): FullLayoutComponent@50:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("ocial Buttons

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/cards']"> Cards

<li class="n"): FullLayoutComponent@51:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("e"> Cards

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/forms']"> Forms

<li class="n"): FullLayoutComponent@52:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. ("e"> Forms

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/switches']"> Switches

<li cl"): FullLayoutComponent@53:75
Can't bind to 'routerlink' since it isn't a known property of 'a'. (" Switches

• <a class="nav-link" routerlinkactive="active" [ERROR ->][routerlink]="['/components/tables']"> Tables

I run the project correctly. But when I did tsc, I get the following errors:

...\CoreUI-Free-Bootstrap-Admin-Template\Angular2_Dev>tsc
node_modules/ng2-bootstrap/components/buttons/button-checkbox.directive.d.ts(14,22): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/buttons/button-checkbox.directive.d.ts(15,22): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/buttons/button-radio.directive.d.ts(10,14): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/buttons/button-radio.directive.d.ts(10,22): error TS1005: ';' expected.
node_modules/ng2-bootstrap/components/dropdown/dropdown-toggle.directive.d.ts(11,14): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/dropdown/dropdown-toggle.directive.d.ts(11,20): error TS1005: ';' expected.
node_modules/ng2-bootstrap/components/modal/modal.component.d.ts(14,14): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/modal/modal.component.d.ts(14,21): error TS1005: ';' expected.
node_modules/ng2-bootstrap/components/modal/modal.component.d.ts(22,22): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/position.d.ts(29,22): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/position.d.ts(30,22): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/tooltip/tooltip-container.component.d.ts(21,14): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/tooltip/tooltip-container.component.d.ts(21,24): error TS1005: ';' expected.
node_modules/ng2-bootstrap/components/typeahead/typeahead-container.component.d.ts(18,14): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/typeahead/typeahead-container.component.d.ts(18,26): error TS1005: ';' expected.
node_modules/ng2-bootstrap/components/typeahead/typeahead-container.component.d.ts(18,44): error TS1005: '(' expected.
node_modules/ng2-bootstrap/components/typeahead/typeahead.directive.d.ts(46,14): error TS1005: '=' expected.
node_modules/ng2-bootstrap/components/typeahead/typeahead.directive.d.ts(46,21): error TS1005: ';' expected.
node_modules/ng2-bootstrap/components/typeahead/typeahead.directive.d.ts(46,33): error TS1005: '(' expected.

Hello,

directly on the docs here:
http://coreui.io/docs/components/modal

When I click on any demo of a modal, the modal appears with a gray overlay on the full screen making it impossible to click anywhere.

Tried on: Safari 9 and Chrome 53 on MacOS X.

Thanks.

Anyone have a project using CoreUI where they were able to use the ng2-Bootstrap Carousel? It seems like something is stepping on the css??? This can be reproduced by using the CoreUI starter project for Angular2-CLI then insert the bootstrap carousel demo .ts and .html. You will see the ul numbered list and images display horizontally all at once down the page instead of inside the carousel. I will troubleshoot more later and report back.

Example:

Example and sample dashboard.component.ts and .html included below.

dashboard.module.zip

error node v5.0.0
20 error npm v3.5.2
21 error code ELIFECYCLE
22 error [email protected] start: tsc && concurrently "tsc -w" "lite-server"
22 error Exit status 1
23 error Failed at the [email protected] start script 'tsc && concurrently "tsc -w" "lite-server" '.

Hello, your theme is very nice. Could u please try to add more pages

• Tab load lazy template
• form with validation
• grid with paging

Thanks,

I don't see the Build Task in the Gulpfile, that's normal?

Hi,

Thanks for this amazing project, I recently make it rtl.

Demo

hope it useful for all

With regards

• Mohammad Sharifi

Hi,
firstly, fantastic project. I'm looking forward to using it :)
I'm testing the Angular 2 version in case that makes a difference.
If the side menu is closed while the main window is large and then the main window is resized to narrow to trigger responsive change, opening the side menu will not work (note, if the side menu is not closed prior to resizing the main window then it works as expected)

I hope that's clear enough, let me know if you need further info

Sean

When i run "npm start"

The error occurs as follow.

app/app.module.ts(8,10): error TS2305: Module '"/Users/[account]/CoreUI-Free-Bootstrap-Admin-Template/Angular2_Dev/node_modules/ng2-charts/ng2-charts"' has no exported member 'CHART_DIRECTIVES'.

So i solved the problem that changed CHART_DIRECTIVES to ChartsModule.

You have two style.css files, slightly different in the project. I'm using the Angular2 CLI Starter.

/src/app/assets/style.css
/src/app/assets/css/style.css

They seem very similar... are they both needed?

It seems there are issues with Extra Small Size for buttons: .btn-xs, and also the Select and Input Small elements.
Their size is the same as normal elements.

I want to use the bootstrap datetimepicker in CoreUI but did not run, what's wrong?

Example :
http://coreui.io/demo/jQuery_Demo/#main.html

Browser :
Chrome, Blisk, Opera

Issue :
Navigating with browser back and forward don't work, working in static and angular version.

I'm thinking something like the side menu in this template

Hi there :),

I just import your theme on my project. I saw a 'vamiddle' . Did you already write it ?

Thx,
Laurent.

Angular2_CLI_Dev/scss and Angular2_CLI_Dev/src/scss contain duplicated file and folders, is there a reason for this?

Why are you copying the Bootstrap files into the CoreUI repository rather than including the files directly from bower_components? Using bower_components directly would surely make it easier to maintain CoreUI and update Bootstrap? You could then gitignore the bower_components directory to remove repo bloat so that for example you don't need to keep a copy of the entire Bootstrap Sass library within your own code. As far as I can see you're not taking full advantage of using Bower.

Hello everyone.

I am using the yeoman generator: aspnetcore-angular2 and I want to include this project template. Can someone help me to integrate CoreUI into ASP.NET project?

Please add a stick footer option to layout too. This theme its great and will be better!

Just wondering if there are any plans to integrate DataTables?

I know that you are working on the React version. Any updates about the progress? If it takes months I will use the Ajax version in my project. Otherwise, I'd like to wait for the React version. By the way, need anyone to help speed it up?

Everything is great.

It could use just yet Auth control thanks to which the dashbooard and pages that are in the same group had access to only the logged in user.

Regards

I was originally going to leave a comment on HN, but figured it might be more constructive to post here.

My primary complaint about most bootstrap themes is that the javascript quality tends to be rather low and it sometimes leads to subtle bugs that are very frustrating to track down. Global functions and variables polluting window is probably the most common issue I find.

https://github.com/mrholek/CoreUI-Free-Bootstrap-Admin-Template/blob/master/dist/Static_Seed/assets/js/app.js#L42
https://github.com/mrholek/CoreUI-Free-Bootstrap-Admin-Template/blob/master/dist/Static_Seed/assets/js/app.js#L66
https://github.com/mrholek/CoreUI-Free-Bootstrap-Admin-Template/blob/master/dist/Static_Seed/assets/js/app.js#L68
https://github.com/mrholek/CoreUI-Free-Bootstrap-Admin-Template/blob/master/dist/Static_Seed/assets/js/app.js#L112
https://github.com/mrholek/CoreUI-Free-Bootstrap-Admin-Template/blob/master/dist/Static_Seed/assets/js/app.js#L117

Additionally, why pollute the $ namespace with constant values? These can easily be plain variables.

https://github.com/mrholek/CoreUI-Free-Bootstrap-Admin-Template/blob/master/dist/Static_Seed/assets/js/app.js#L8

All javascript should be wrapped in a closure, 'use strict'; should be included in the closure, and var should always be used when declaring variables.

Demo link to coreui.com is broken in README file.

Thank you for sharing this great admin template!

A Use Case that I have is to have detailed information of selected item on main panel displayed. Aside Menu on Right Panel seems to be a suitable solution. However, the current Aside does not seem support long information (i.e. it does not have its own scrollbar) - thus user won't be able to view some information.

Do you have any plan to support multiple scrollbars display? Is there any recommended workaround?

I noticed that there isn't a composer package for the coreui.
Could you create one so i and other can easily keep track of the updates?

• Gulp Scripts for AngularJS Version
• Gulp Scripts for jQuery Version
• Gulp Scripts for Static Version