阻止下一个组件的调用，直到承诺完成另一个组件的角度2

我已经为此搜索了很多，但不幸的是我没有得到任何东西。阻止下一个组件的调用，直到承诺完成另一个组件的角度2

上下文

我有一个部件，其中我有两个孩子选择像下面。

<div class="wrapper"> 
 
    <div class="main-panel"> 
 
    <navbar-cmp></navbar-cmp> 
 
    <router-outlet></router-outlet> 
 
    <!--<div *ngIf="!isMap()"> 
 
     <app-footer></app-footer> 
 
    </div>--> 
 
    </div> 
 
    <div class="sidebar" data-active-color="blue" data-background-color="white"> 
 
     <!-- <div class="sidebar" data-color="red" data-image=""> --> 
 
     <sidebar-cmp></sidebar-cmp> 
 
     <!--<div class="sidebar-background" style="background-image: url(assets/img/sidebar-1.jpg)"></div>--> 
 
    </div> 
 

 
</div>

所以根据这个导航栏部分将被调用，导航栏包含哪些需要一段时间的承诺。但是，在完成nav-bar组件中的承诺之前，我的流程会转到侧边栏组件。但我希望该控件不应该转到边栏组件，直到它清除导航栏组件中的承诺。

来源

2017-08-30 Ritesh kumar Agrahari

试试这个：

@Component({ 
    selector: 'navbar-cmp', 
    templateUrl: './navbar-cmp.html', 
    }) 
    export class NavBarComponent implements OnInit { 
    promiseIsCompleted :boolean = false; 
    constructor(private signUpService: SignUpService) { 
    } 
    ngOnInit() { 
     youPromise.then(()=>{ 
      this.promiseIsCompleted = true; 
     }) 
    }

HTML：

<div class="wrapper"> 
    <div class="main-panel"> 
    <navbar-cmp #navbar ></navbar-cmp> 
    <router-outlet></router-outlet> 
    <!--<div *ngIf="!isMap()"> 
     <app-footer></app-footer> 
    </div>--> 
    </div> 
    <div class="sidebar" data-active-color="blue" data-background-color="white"> 
     <!-- <div class="sidebar" data-color="red" data-image=""> --> 
     <sidebar-cmp *ngIf="navbar.promiseIsCompleted"></sidebar-cmp> 
     <!--<div class="sidebar-background" style="background-image: url(assets/img/sidebar-1.jpg)"></div>--> 
    </div> 

</div>

来源

2017-08-30 11:22:10

谢谢，它的工作。 –

阻止下一个组件的调用，直到承诺完成另一个组件的角度2

回答

相关问题