Modal - 无法关闭和@Input使用外部组件

Question

我试图使用@Input与组件，但无法弄清楚当我点击打开模式时如何发送变量。例如，我有以下的模板：

<template #modalContent> 
    <my-component-with-content [var1]="val1"></my-component-with-content> 
</template> 

，当我点击打开模式：

<button type="button" (click)="open(modalContent)" class="btn btn-default">Open</button> 

我也困惑与关闭功能。

我已经试过：

<template #modalContent let-close='close'> 
    <my-component-with-content></my-component-with-content> 
</template> 

，在我的分量，与内容（HTML），当我尝试调用(click) = close("close")我得到以下错误：self.context.close不是一个函数

所以我的问题是我怎样才能通过VAR1当我点击打开按钮，我怎样才能通过close函数到外部组件？

编辑：我使用的是ng-bootstrap modal

Answer 1

注意，这在角2.0.1达到了，NG-引导alpha6

你可以通过你的贴心的功能与您的组件：

<template #modalContent let-c="close"> <my-component [var1]="val1" [close]="c"></my-component> </template>

这使您可以拨打这势必modalConten关闭功能吨。您为var1指定的输入绑定意味着您的输入是从父组件中的名为val1的变量设置的，因此无需在打开时传递，因为您列出的第一个方法应该可以工作。

import { Component, Input } from "@angular/core"; 

@Component({ 
selector: "my-component", 
template: "<h2>{{var1}}</h2>" + 
    "<button (click)='close()'>Close</button>" 
}) 
export class MyComponent { 
    @Input() 
    var1: string; 

    @Input() 
    close: Function; 
} 

在我包含组件声明公共 val1: string = "some thing";

当我点击按钮，打开它显示一些事情有一个按钮，下压时，它会关闭模式的模板。