angular - Angular2 Componenet not rendering only on refresh -


i'm trying build angular 2 admin application,after login i'm redirected dashboard (dashboardcomponenent) rendering when refresh page. tried several methods fix problem nothing worked.

i believe problem comes app.componenet.html

  <div *ngif=" title!='login' && title!='signup'&& title!='forgot'&& title!='forgotpass'"  class="wrapper">     <div class="sidebar" data-background-color="white" data-active-color="danger">         <sidebar-cmp></sidebar-cmp>     </div>     <div class="main-panel">         <navbar-cmp></navbar-cmp>         <div class="content">             <router-outlet></router-outlet>          </div>         <footer-cmp></footer-cmp>     </div>  <!--    <fixedplugin-cmp></fixedplugin-cmp> -->   </div> <div *ngif="title=='login' " class="wrapper">      <router-outlet></router-outlet>     </div>     <div *ngif="title=='signup' " class="wrapper">      <router-outlet></router-outlet>     </div>     <div *ngif="title=='forgot' " class="wrapper">      <router-outlet></router-outlet>     </div>     <div *ngif="title=='forgotpass' " class="wrapper">      <router-outlet></router-outlet>     </div>

any idea cause of problem?

you have modify app.module.ts below. >

const approutes: routes = [
{ path: 'login', component:yourlogincomponent },
{ path: 'signup', component:yoursignupcomponent }, { path: 'forgot', component:yourforgotcomponent }, { path: 'forgotpass', component:yourforgotpasscomponent }, { path: '', redirectto: '/login', // in case no path provided pathmatch: 'full' } ];

@ngmodule({ imports: [ routermodule.forroot( approutes, { enabletracing: true } // <-- debugging purposes ) // other imports here ], ... }) export class appmodule { }

and in app.component.html can have:

<nav> <a routerlink="/login">login</a> <a routerlink="/signup">sign up</a> <a routerlink="/forgot">forgot</a> <a routerlink="/forgotpass">forgot pass</a> </nav> <router-outlet></router-outlet>

so happens here nav in app.component.html acts remote control switch channels. instruction working process of remote control defined in approutes under app.module.ts. , acts television screen see selected channel. in case there no use of multiple router outlets.

for deeper understanding can go through https://angular.io/guide/router


Comments

Post a Comment

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

i've set bento/ubuntu-16.04 vagrant box using php 5.6, , getting following error quite few times when try , run shell script: "uncaught reflection exception: class domdocument not exist". i've tried adding following top of script (not together), each no success: "sudo apt-get install php5.6-xml", "sudo apt-get install php5-xml", "sudo apt-get install php-dom" i've tried resetting server "sudo service apache2 restart". does have suggestions?
Read more

vue.js - Create hooks for automated testing -

Image
qa guys complained can't automate frontend testing. because our html looks same outside. lazy hack did this <template> <div :role="$options.name"> ... </div> </template> <script> export default { name: 'vmcomponentname' } </script> which takes name script , applies html. in browser get: <div role="vmcomponentname"> ... </div> line :role="$options.name" goes in every component. is there dry er solutions? please share. additional details i'll explain in details looking for. imagine have vmusercreate form creates user. test case can create user . to automatically test without role, have use following selector: .wrapper > .wrapper > .wrapper > .submit-button the test extremely brittle (will break lot). if use roles can use [role="vmusercreateform"] .submit-button selector. many folds less brittle. so basically, i'm ...
Read more

Add new key value to json node in java -

i have json file : { "id":1, "name":"abc", "addressdetails": { "city":"newyork" } } i wanted add 1 more key-value ("pincode" : "414141") node 'addressdetails'. i tried using : objectmapper mapper = new objectmapper(); jsonnode root = mapper.readtree(new file("d://test.json")); objectnode node = mapper.createobjectnode(); node.with("addressdetails").put("pincode", "414141"); but it's not getting added, there way can ? you can try you should modify file path objectmapper mapper = new objectmapper(); objectnode nodes = mapper.readvalue(new file("d:\\test.txt"), objectnode.class); nodes.with("addressdetails").put("pincode", "414141"); mapper.writer().writevalue(new file("d:\\test.txt"), nodes);
Read more