Question

我正在尝试删除导航栏NavBar Pic上的“联系人”按钮。我已经尝试了所有我知道的东西并且卡住了。我是Angular / Typescript的新手，所以任何帮助都会受到赞赏。下面列出的代码来自contacts.components.ts文件。此外，我查看了navbar.component.html页面，并且没有提及其中任何地方的联系人。

来自contacts.components.ts文件：

import { IProductConfig } from 'app/interfaces/interfaces';
import { BaseComponent } from './../base.component';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-contacts',
  templateUrl: './contacts.component.html',
  styleUrls: ['./contacts.component.css']
})
export class ContactsComponent extends BaseComponent implements OnInit {
  productOptions: IProductConfig;
  queryUrl: String;
  getContactsContentViewFields: JSON;

  ngOnInit() {
    this.productOptions = this.product_config

    this.getContactsContentViewFields = JSON.parse(`{           
      "Description" : {"title":"", "type":"string"}
    }`);

  }
}

来自navbar.component.html

<ul class="nav">
        <li *ngFor="let level1Item of sidebarLinks" 
routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
          <a *ngIf="level1Item.Href" [href]="level1Item.Href" [attr.data-
toggle]="level1Item?.children?.length > 0 ? 'collapse': null"
            [attr.aria-expanded]="(level1Item.isExpanded == true) ? 'true' : 
'false'" [attr.target]="level1Item?.OpenInNewTab ? '_blank': '_blank'">
            <!--<i class="material-icons" *ngIf="level1Item.TabIcon" 
routerLinkActive="white-text">{{level1Item?.TabIcon}}</i>
            <i class="material-icons" *ngIf="!level1Item.TabIcon" 
routerLinkActive="white-text" style="visibility:hidden 
!important;">stop</i>-->
            <p>{{level1Item.Level1Title}}
              <b *ngIf="level1Item?.children?.length > 0" class="caret"></b>
            </p>
          </a>

Answer 1

如果您想限制对“联系人”页面的访问，可以通过多种方式进行操作。

如果删除或禁用导航栏中的“联系人”按钮，那么你只需要修改导航栏的HTML代码。
如果不删除或禁用导航栏中的“联系人”按钮那么你可以尝试使用angular route gaurds。您可以在保护文件的canActivate（）函数中返回false，以便始终限制对用户的访问。

Answer 2

很抱歉我无法发表评论，但我发现有时设置* ngIf以检查相等而不是 null检查，无论出于什么原因，在运行时都会更好UI更新。喜欢：

* ngIf =“level1Item ==”aValueYouAreLookingFor“

如果只是更改检测，请查看this和ngZone ngZone在我当前项目的更大操作中更新UI方面发挥了重要作用，因此值得一看。我一直在使用Angular 4+，因为它出来并且像Angular JS一样，它可以用几个黑客来完成任务:-)祝你好运！

从NavBar中删除组件

2 个答案: