Question

此代码没有问题

更具体

我是否可以在我的HTML角度内创建值？

我什么都找不到，所以我想不起来，如果我想创建一个自动菜单该怎么办。我在此使用角形材料

我需要创建一个导航栏，但是我用角度HTML创建了导航栏，并在TS中添加了一些东西，以创建需要自动的数据

所以我需要用任何值循环代码的底部，但是我不知道如何开始

        <!-- need to loop this block of code whenever there is any new item with children -->
                    <div *ngFor="let childss of childs.children">
                      <div *ngIf="childss.children != null">
                        
                      </div>
                      <a routerLink="/{{navRoute.path}}/{{childs.path}}/{{childss.path}}"><button mat-menu-item>{{childss.path}}</button></a>
                    </div>
        
                  </mat-menu>
              </div>
              <ng-template #elsesBlock>
                <a routerLink="/{{navRoute.path}}/{{childs.path}}"><button mat-menu-item>{{childs.path}}</button></a>
              </ng-template>
              <!-- till here but have no idee how to do this effectively -->

childs是数组的项目

但是它需要自定义输入数据才能使循环正常运行，但是如果执行该操作，我不知道

  
  <div class="nav_items" *ngFor="let navRoute of navRoutes">
      <div *ngIf="navRoute.children != null; else elseBlock">
        
        <div *ngIf="navRoute.children != null">
          <a routerLink="/{{navRoute.path}}">
            <button mat-button [matMenuTriggerFor]="menu">{{navRoute.path}}</button>
          </a>

          <mat-menu #menu="matMenu"> 

            <div *ngFor="let childs of navRoute.children">
              
              <div *ngIf="childs.children != null; else elsesBlock">
                  <a routerLink="/{{navRoute.path}}/{{childs.path}}">
                    <button mat-menu-item [matMenuTriggerFor]="child">{{childs.path}}</button>
                  </a>
        
                  <mat-menu #child="matMenu"> 
        <!-- need to loop this blok of code when ever there is anny new item with children -->
                    <div *ngFor="let childss of childs.children">
                      <div *ngIf="childss.children != null">
                        
                      </div>
                      <a routerLink="/{{navRoute.path}}/{{childs.path}}/{{childss.path}}"><button mat-menu-item>{{childss.path}}</button></a>
                    </div>
        
                  </mat-menu>
              </div>
              <ng-template #elsesBlock>
                <a routerLink="/{{navRoute.path}}/{{childs.path}}"><button mat-menu-item>{{childs.path}}</button></a>
              </ng-template>
              <!-- till here but have no idee how to do this effectively -->
            </div>

          </mat-menu>        
        </div>
        
      </div>
        
      <ng-template #elseBlock>
        
        <a routerLink="/{{navRoute.path}}">
          <button mat-button>{{navRoute.path}}</button>
        </a>

      </ng-template>

 </div>

这是我的整个HTML

导航路线是我的路线中的一个数组

我尝试了HTML链接，但不适用于有角项目

Answer 1

为您的routerLink尝试以下语法：

[routerLink]="['/' + navRoute.path + '/' + childs.path]"

angular7构建一个navroute组件，但现在不知道该怎么办

1 个答案: