akveo / blur-admin

AngularJS Bootstrap Admin Panel Framework
http://akveo.github.io/blur-admin/
Other
11.37k stars 3.1k forks source link

Create New Page ~ Documentation (step missing) #75

Open rjpalermo1 opened 8 years ago

rjpalermo1 commented 8 years ago

Missing a step in your Create New Page Documentation here

You also need to update the pages.module.js by adding:

  angular.module('BlurAdmin.pages', [
    'ui.router',
   'BlurAdmin.pages.myNewPage',
   ...
  ])
brijesh1ec commented 8 years ago

1) first create the folder as per feature(welcome). 2) under the folder add the Welcome.module.js.name it 'app.pages.welcome' 3) add Welcome.conntroller.js file 4) then in pages.module.js file add the 'app.pages.welcome' to app.page module. 5) inculde the module.js, controller.js( all js file) in Index.html file.

it will load the module in pages.

rjpalermo1 commented 8 years ago

Yes, I figured it out, Your document I linked above is missing step number 4. It was an FYI.

brijesh1ec commented 8 years ago

MIssing thing is, how to load the login page. 1) Create the new module. app.page.login, file Login.module.js file, 2) create controller Login.controller.js file. 3) create services Login.Services.js file. 4) inculde this file in Index.html page. it loads the Login page in UI-View under the content page,

ISSUE- Side bar and top navigation appreas, ideally login page should render fully across the page.

Solution. 1) Create another root page or main page. 2) if Index.html is root page then main section should be moved to main.html file 3) Create folder Main , create app.page.main mdoule in Main.module.js file, same way add controller and services file. 4) Inject the app.page.Main module in app.page module and
5) Include this new .js files in Index.html files. 6) include UI-VIEW in index.html file,(if it is not there un named ui-view). it will load the login page as full page. 7) on click of login Page user State.go('Main) state to go to main.html file which is having main section with Side,Page top, top content and another UI-VIEW. which will load the Side bar, page top, and content page, on click of menu, it should open the views in content page.

ISSUE- it opens the views with parent UI-VIEW(index.html) not in child view(Main.html).

There are two UI-Views (un named). one in Index.html page, another in Main.html page. how to load the views on click of side bar in content page(main.html). Why it opens the views with Index.html page. Its really may be a bug or there way to load the content inside child view(main.html).

total there are 3 UI-VIEW, a) Index.html for login page to render, b) main.html to render the content,c) which loads submenu iteams( abstract true).

In Blur admin there are two UI-VIEW which works fine, why it doesn't works with 3 UI-VIEW.

vazh commented 8 years ago

@brijesh1ec mine works fine with 3 ui-view.

@rjpalermo1 the thing with adding a new page, is not should be written here. you need to understand how angular module naming works.

brijesh1ec commented 8 years ago

for me also works, only thing is it opens the menu in top parent ui-view.

where to keep the login. once it authenticate user need to send it to main page(landing page) . when user visit to main page and click links in side menu it opens in full page.

could you suggest. as i am new to this, may be its my routing issue, or loading named view Example, if(isauthenticated) $state.go('main'); main module contains

(function () { 'use strict';

angular.module('app.pages.main', [])
  .config(routeConfig);

/** @ngInject */
function routeConfig($stateProvider) {
    $stateProvider
        .state('main', {
            url: '/main',
            templateUrl: 'app/pages/main/main.html',
            sidebarMeta: {
                icon: 'ion-android-home',
                order: 0,
            },

        });
}

})();

main.html

<page-top></page-top>
<div class="al-main">
    <div class="al-content">
        <content-top></content-top>
        <div ui-view=""></div>
    </div>
</div>
<footer class="al-footer clearfix">
    <div>
        <p align="center">footer</p>
    </div>
    <div class="clearfix"></div>
</footer>

<back-top></back-top>

Thanks, Warm Regards :Brijesh Pal Mobile : +919790752446

On Sat, Jun 18, 2016 at 4:13 AM, Muhammad Hariz Faza < notifications@github.com> wrote:

@brijesh1ec https://github.com/brijesh1ec mine works fine with 3 ui-view.

@rjpalermo1 https://github.com/rjpalermo1 the thing with adding a new page, is not should be written here. you need to understand how angular module naming works.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/akveo/blur-admin/issues/75#issuecomment-226898573, or mute the thread https://github.com/notifications/unsubscribe/AGltbJtzH61dTJLc30hhHbv1OvR_ng92ks5qMyMtgaJpZM4I4f6t .

sanwal123 commented 7 years ago

I did everything in the document plus I did the missing step as well but get lot of errors. etc jquery.js:3855 Uncaught Error: [$injector:modulerr] Failed to instantiate module BlurAdmin due to: Error: [$injector:modulerr] Failed to instantiate module BlurAdmin.pages due to: Error: [$injector:modulerr] Failed to instantiate module BlurAdmin.pages.users due to: Error: [$injector:nomod] Module 'BlurAdmin.pages.users' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument. http://errors.angularjs.org/1.5.11/$injector/nomod?p0=BlurAdmin.pages.users at http://localhost:3002/admin/bower_components/angular/angular.js:68:12 at http://localhost:3002/admin/bower_components/angular/angular.js:2133:17 at ensure (http://localhost:3002/admin/bower_components/angular/angular.js:2057:38) at module (http://localhost:3002/admin/bower_components/angular/angular.js:2131:14) at http://localhost:3002/admin/bower_components/angular/angular.js:4669:22 at forEach (http://localhost:3002/admin/bower_components/angular/angular.js:325:20) at loadModules (http://localhost:3002/admin/bower_components/angular/angular.js:4653:5) at http://localhost:3002/admin/bower_components/angular/angular.js:4670:40 at forEach (http://localhost:3002/admin/bower_components/angular/angular.js:325:20) at loadModules

Any help ?