相关疑难解决方法(0)

将范围数据传递到Angular2中的ng-content

我正在寻找将当前组件范围数据传递给ng-content指令的解决方案.

我的app-table组件模板包含我想传递给子内容的数据,使用这样的解决方案:

<!-- some html before -->
<table>
    <!-- complex header markup with sorting/filtering support -->

    <tr *ngFor="let item of data">
         <ng-content [value]="item"></ng-content> //how to pass data?
    </tr>
</table>
//some html after
Run Code Online (Sandbox Code Playgroud)

以及我想要使用此数据的页面模板:

<app-table>
     <td>{{value.Name}}</td>
     ...
</app-table>
Run Code Online (Sandbox Code Playgroud)

这可能吗?

typescript angular

15
推荐指数
3
解决办法
1万
查看次数

如何在Angular 2及更高版本中实现模态对话框

我是棱角分明的新手.

我使用了包ng2-bootstrap使用了bootstrap模式.

我的查看文件是

<div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title pull-left">Area Master</h4>
        <button type="button" class="close pull-right" (click)="lgModal.hide();" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        Modal Content here...

      </div>
      <div class="modal-footer">
        <button type="submit" class="btn btn-primary">Add</button>
      </div>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

我需要知道如何从组件(类型脚本文件)中显示/隐藏此模式.

输入脚本文件是

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { Router } from '@angular/router';
import { FormGroup, Validators, FormBuilder, FormControl } from '@angular/forms';
import { Area …
Run Code Online (Sandbox Code Playgroud)

ng2-bootstrap ngx-bootstrap angular

11
推荐指数
1
解决办法
3万
查看次数

Angular 2将transcluded内容绑定到循环变量

我试图将transcluded内容绑定到组件循环内部的变量,但我无法这样做.

我查看了PrimeNG的dropdown组件,他们一起使用template标签let-car绑定到car循环的变量.

但是,当我尝试这个时,我甚至无法将内容转换为内容.实现这一目标的正确方法是什么?

尝试:

<!-- Obviously not gonna work -->
<comp>
  <span>{{option.name}}, {{option.type}}</span>
</comp>

<!-- Thought this would work but it doesn't, in odd scenarios I get the last element of the loop to transclude content and bind correctly. -->
<comp>
  <template let-option>
    <span>{{option.name}}, {{option.type}}</span>
  </template>
</comp>
Run Code Online (Sandbox Code Playgroud)

在组件中:

<ul>
  <li *ngFor="let option of options">
    <ng-content></ng-content>
  </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

简单的我正在努力实现的目标:

https://plnkr.co/edit/6SS03fuXmbvJB4nmf1AO?p=preview

typescript angular

10
推荐指数
1
解决办法
4385
查看次数

md-tabs使用代码转到角度2材质设计中的选项卡

我正在使用Angular2创建一个应用程序,我需要使用选项卡内的按钮在选项卡之间导航.

我的html如下:

<md-tab-group>
<md-tab label="one">
   <button md-raised-button>Navigate to Two</button>
   <button md-raised-button>Navigate to Three</button>
</md-tab label>
<md-tab label="two">
</md-tab label>
<md-tab label="three"> 
</md-tab label>
</md-tab-group>
Run Code Online (Sandbox Code Playgroud)

因此,当我单击导航到三时,它应该带我到选项卡名称三

我正在使用Angular2材料设计这个例子可以有人知道解决这个问题.

提前致谢

typescript angular-material angular

5
推荐指数
1
解决办法
1万
查看次数