Question

我有一个包含三个字段的表单

<div class="modal fade">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">
            Form
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <form>
            <div class="form-group col-md-12">
              <label>ID </label>
              <input class="form-control" type="text" [value]="question.id" name="id"
                [(ngModel)]=question.id>
            </div>
            <div class="form-group col-md-12">
              <label>LABEL </label>
              <input class="form-control" type="text" [value]="question.label" name="label"
                [(ngModel)]=question.label>
            </div>
            <div class="form-group col-md-12">
              <label>TYPE </label>
              <input class="form-control" type="text" [value]="question.type" name="type"
                [(ngModel)]=question.type>
            </div>
            </div>
        </form>
      </div>
    </div>
  </div>
</div>

在组件中，我有一个我要参考的问题

question: any = {
    id: null,
    label,
    type: null
  };

现在我想将这些输入中的两个传递给新组件，以便留下类似的东西

<div class="modal fade">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">
            Form
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">

          <form>
<two-inputs></two-inputs>
            <div class="form-group col-md-12">
              <label>TYPE </label>
              <input class="form-control" type="text" [value]="question.type" name="type"
                [(ngModel)]=question.type>
            </div>
            </div>
        </form>
      </div>
    </div>
  </div>
</div>

但是如果我使用此html创建双重输入组件

<div class="form-group col-md-12">
              <label>ID </label>
              <input class="form-control" type="text" [value]="question.id" name="id"
                [(ngModel)]=question.id>
            </div>
            <div class="form-group col-md-12">
              <label>LABEL </label>
              <input class="form-control" type="text" [value]="question.label" name="label"
                [(ngModel)]=question.label>
            </div>

它不能识别问题，因为它当然不存在于组件中，但存在于父组件中...是否有一种简单的方法来引用它，而不必诉诸@Input或@Output服务？

在Angular中使用父组件的属性

0 个答案: