模态文本返回未定义

Question

所以，我已经研究了很长时间。我有一个模态框，里面有一个文本区域。我想要发生的是，当有人点击发布时，我想看看他们发布的内容。目前，它返回未定义，我不明白为什么。代码如下：

test.component.html

<form>
  <div class="form-group">
    <label for="exampleFormControlTextarea1">Confess.</label>
    <textarea class="form-control" id="textarea" rows="3"></textarea>
  </div>
  <button type="button" (click)="submitPost()" class="btn btn-primary postMssg">
    Post
  </button>
</form>    
<div *ngFor="let data of datasource; let i = index">
  {{ data.post }}
  <button
    type="submit"
    data-toggle="modal"
    [attr.data-target]="'#' + data.key"
    (click)="check('#' + data.key)"
  >
    Reply
  </button>
  <div
    class="modal fade"
    [attr.id]="data.key"
    tabindex="-1"
    role="dialog"
    aria-labelledby="exampleModalLabel"
    aria-hidden="true"
  >
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
          <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">
              <label for="commentText">Example textarea</label>
              <textarea
                class="form-control data.key"
                id="commentText"
                rows="3"
              ></textarea>
            </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">
            Close
          </button>
          <button
            type="button"
            (click)="addComment(data.key)"
            class="btn btn-primary"
          >
            Post
          </button>
        </div>
      </div>
    </div>
  </div>
</div>

test.component.ts

 addComment(key) {
    let res = "." + key;
    let complete = $("." + key).val();
    console.log(complete);
  }    
  check(key) {
    console.log(key);
  }


submitPost() {
    // console.log(this.idCount);
    let post = $("#textarea").val();

    if (post !== "") {
      // this.posts = [];
      let item = this.db.list("/test").push({
        post: post,
        name: localStorage.getItem("name"),
        likes: 0,
        id: this.idCount + 1,
        likeBtn: 0,
        fireBtn: 0,
        time: moment().format("llll")
      });

      this.db.database
        .ref("/test")
        .child(item.key)
        .update({ key: item.key });

      this.datasource.push({
        post: post,
        name: localStorage.getItem("name")
      });
    }

    let result = this.db
      .list("/testID")
      .valueChanges()
      .subscribe(val => {
        val.forEach((value: any) => {
          this.db.database
            .ref("/testID")
            .child("1")
            .child("idCount")
            .transaction(count => {
              return count + 1;
            });

          this.unsubscribe(result);
        });
      });

    $("#textarea").val("");
  }

如果您不愿意捐出 2 美分，请随时将我引导至可能会有所帮助的帖子或文章。我已经阅读了很多这样的帖子，没有什么比我正在处理的更重要了。我前一阵子做过这个，我不记得把它放在一起有那么困难。 Anywho，我正在尝试为我创建的网站的帖子创建评论部分。当您看不到数据时，很难创建评论部分。

我认为这是我的类名的问题，但它们都是唯一的，并且当我尝试控制台时正在填充它们。在 addComment 部分记录它们

Answer 1

textArea 没有分配模型。在 textarea 中使用 ngModel 并将该模型传递给关闭模式的标签。

添加：

  <ion-textarea placeholder="Comienza a dictar" [(ngModel)]="data" name="title" class = "botonesNotaPorAudio"></ion-textarea>

data 包含你的 textArea 的值， 也就是说，如果你写“Hello”，则 TEH VARIBLE 的值就是“Hello”。

在“.ts”文件中，您可以像这样执行 somthenig：

dismiss(data:any) {  
    this.viewCtrl.dismiss(data);
  }

你会在你的compenent中记录信息

 modal.onDidDismiss(data => {
  this.otherPuntoDescripcion=Object.assign({},data);
  this.puntoDescripcion.getDescripcion(this._dataBaseService,this.selectConvocatoria,localStorage.getItem("idPunto")).then(
    (resp:any)=>{   
      this.listPuntoDescription=resp;
    }
  );
});