NodeJS рендер html файл с формой не работает на angular стороне - PullRequest
2 голосов
/ 21 января 2020

Я использую ExpressJS с E JS движком просмотра шаблонов. Я пытаюсь показать файл HTML на компоненте angular, но тег формы и его дочерний тег ввода не работают на стороне angular. Они показывают только данные метки.

Вкл. NodeJS

AgreementController. js

exports.getAgreementHtml = async (request, response, next) => {
    const params = request.query
    let reqPath = path.join(__dirname, '../agreements');
    var agreementObj = {
        user: { email: "example@gmail.com" }
    }
    // render domestic rent html
    ejs.renderFile(reqPath + '/domestic_rent.ejs', agreementObj, {}, function (err, str) {
        if (err !== null) {
            responseObj.status = errorCodes.DATA_NOT_FOUND
            responseObj.message = language.getMessage('NO_RECORD_FOUND')
            response.send(responseObj)
            return
        }

        responseObj.status = errorCodes.OK
        responseObj.data = str
        response.send(responseObj);
        return;
    });
}

domestic_rent. js

  <form>
    <div class="form-group">
        <p><%= user.email %></p>
        <div class="col-sm-offset-2 col-sm-10">
            <input type="text" class="form-control" id="inputEmail3" placeholder="test" required name="test">
        </div>
    </div>
</form>

На Angular 8 Сторона

Agreement-show.component.ts

  getAgreementData() {
    const params = {
      id: this.agreementId
    };
    this.agreementService.getAgreementHtml(params).subscribe(
      (result) => {
        console.log('result agreement data::: ', result);
        if (result.status !== 200) {
          this.commonService.change.emit({ status: 'error', message: 'unknown error' });
          return;
        }
        this.someHtml = result.data;
        return;
      }, (error) => {
        console.log('error', error)
        this.commonService.change.emit({ status: 'error', message: error.message });
      }
    );
  }

соглашение-show.component. html

<div [innerHTML]="someHtml"></div>

Выходное приложение

1 Ответ

3 голосов
/ 22 января 2020

Используя функцию ElementRef , мы можем добавить html время выполнения. Пожалуйста, используйте следующий шаг:

        @ViewChild('showitems') showitems: ElementRef;

        const elemt: HTMLElement = this.showitems.nativeElement;
        this.someHtml = result.data;
        elemt.innerHTML = this.someHtml;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...