Angular не может получить пользовательский ввод, переданный в машинописный текст из HTML

html

<input #box (keyup.enter) = "Character(box.value)"/>

машинопись

Character(value: string) {
  console.info("print this " + value);
}

Я подтвердил код машинописного текста в двух разных местах в сети и получил html-код из другого ответа здесь, и хотя функция машинописного текста выполняет «значение», просто не будет печататься на консоли. Я даже изменил тему своего браузера, думая, что в какой-то момент это мешало. (потому что он меняет цвет текстовых полей и на некоторых сайтах текст смешивается с полем)

Обновлять Как вы можете понять из выбранного ответа, я не осознавал, что моя проблема заключалась в том, что у меня было два текстовых поля, которые вызывали проблему, потому что значение не просто передавалось обоим, как я предполагал.

Честность, почему голос против?

codehelp4 31.10.2018 09:09

Работает, можете проверить здесь stackblitz.com/edit/angular-2hkxz1

Anshuman Jaiswal 31.10.2018 09:13

@trichetriche Я подумал, что, возможно, именно поэтому меня проголосовали против, но я не знаю, что еще это показывает. Проект сделан из ng new, и большая часть кода по-прежнему остается этим материалом.

codehelp4 31.10.2018 10:12
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
3
3
1 027
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

что вы можете сделать, так это обернуть вводимые данные в тег формы, например:

<form (ngSubmit) = "submit()">
    <input type = "text" [(ngModel)] = "name" name = "name">
</form>

В машинописном тексте:

name = '';
submit() {
  console.info(this.name);
}

Функция машинописного текста работает должным образом, но текст переменной не отображается. ibb.co/jyhznf

codehelp4 31.10.2018 10:09

@ codehelp4 он вызовет метод отправки, когда вы нажмете ввод

Saad Mehmood 31.10.2018 10:58
Ответ принят как подходящий

Это работает, как ожидалось:

См .: https://stackblitz.com/edit/angular-jcrcdu?file=src%2Fapp%2Fapp.component.html

app.component.html

<input #box (keyup.enter) = "Character(box.value)"/>

<p>{{box1name}}</p>




<input #box2 (keyup.enter) = "onEnter(box2.value)"/>

<p>{{box2name}}</p>

app.component.ts

 import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  box1name = 'Angular';
  box2name = 'Angular2';

  Character(value: string) {
  this.box1name = "print this for box1 :" + value;
  console.info(this.box1name);
}

  onEnter(value: string) {
  this.box2name = "print this for box2: " + value;
  console.info(this.onEnter);
}


}

Это так странно, потому что в моей консоли Firefox это не отображается. Смотрите мой скриншот. ibb.co/jyhznf

codehelp4 31.10.2018 10:05

это работает в firefox, также нажмите клавишу ввода после ввода

Dinesh Ghule 31.10.2018 10:11

Я сделал это, как другой текст, который является прямой строкой, запускается для печати. (текст, показанный на скриншоте) Я попробую dev firefox.

codehelp4 31.10.2018 10:14

какую версию firefox вы используете

Dinesh Ghule 31.10.2018 10:16

демоверсия, которую вы опубликовали, мне тоже подходит, но моя собственная - нет. Версия ff - версия ff Quantum 63.0 dev не имела значения.

codehelp4 31.10.2018 10:21

можете ли вы добавить свой код для рассматриваемого файла .html и .ts?

Dinesh Ghule 31.10.2018 10:22

Позвольте нам продолжить обсуждение в чате.

Dinesh Ghule 31.10.2018 10:23

Другие вопросы по теме