时间戳

首页 > 解决方案 > 如何以角度4在另一个html页面中的html页面上显示

html - 如何以角度4在另一个html页面中的html页面上显示

问题描述

嗨，我正在研究 Angular 4

我想知道的是我们如何(click)在另一个 HTML 页面中绑定 HTML 页面

我试过了*ng-if，<ng-template>但对我没有用

所以我只使用了基本的 HTML 和 Bootstraptab-pane fade以及data-toggle我的菜单

但我想为以下三个菜单项设置单独的 HTML 页面，并希望在单击相应的菜单时绑定这些相应的页面

我想在单击菜单时弹出一个模态，但我在另一个文件夹中有一些常见的模态

<ul class="nav nav-tabs flex-column" role="tablist">
  <li class="nav-item">
    <a class="nav-link active" href="#myappdefinitions" data-toggle="tab">My app definitions</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#shared" data-toggle="tab">shared with me</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#others" data-toggle="tab">shared with others</a>
  </li>
</ul>

<div id="apptab">
  <div class="row justify-content-between">
    <div class="tab-content col-7">
      <div class="row tab-pane fade show active" id="myappdefinitions">
        <p class="text-muted">You have one app definition</p>
      </div>
      <div class="row tab-pane fade" id="shared">
        <p class="text-muted">you are in shared apps</p>
      </div>
      <div class="row tab-pane fade" id="others">
        <p class="text-muted">you are in shared with others</p>
      </div>
    </div>
  </div>
  <div class="input-group">
    <span class="input-group-addon search-img">
                <i class="fa fa-search img-search" aria-hidden="true"></i>
              </span>
    <input type="text" class="form-control search-box" (click)="filterDelayed()" placeholder="search">
  </div>
</div>

标签： htmlangulartypescriptbinding

解决方案

您应该创建另一个组件（让我称之为child）并将其导入其父组件（在.ts文件中），然后在父.html文件中调用子选择器（标签）并创建您想要的任何内容。

推荐阅读