Question

我在<div>元素中的任何文本之后放置{{text}}的那一刻，该元素从浏览器中消失。如果我从＆＃34中删除{{text}}，则会填写＆＃34;然后填写文本＆＃34;＆＃34;显示。

已填写{{已填写？＆＃39;是＆＃39; ：＆＃39;否＆＃39;}}

不确定我做错了什么。

import {Component} from "angular2/core";

@Component({
  selector: 'my-input',
  template: `
  <h2>Your details please</h2>
  <div>
    <label for="name">Your Name:</label>
    <Input type="text" id="name" [(ngModel)]="myself.name" (keyup)="onKeyup()">
  </div>
  <div>
    <label for="age">Your Age:</label>
    <Input type="text" id="age" [(ngModel)]="myself.age" (keyup)="onKeyup()">
  </div>
  <br>
  <div>Is Filled out {{isFilled ? 'Yes' : 'No'}}</div>
  <div>Is Valid </div>
  <br>
  <button [disabled]="!isValid">Submit</button>

  `
})

export class InputComponent {
  myself = {name: '', age: ''};
  isFilled = false;
  isValid = false;

  onKeyup() {
    if (this.myself.name != '' && this.myself.age != '') {
      this.isFilled = true;
    }
    else {
      this.isFilled = false;
    }
    if (this.myself.name != '' && /^\d+$/.test(this.myself.age)) {
      this.isValid = true;
    }
    else {
      this.isValid = false;
    }
    }

  }

这是CSS

body {
    padding: 32px;
    margin: 32px;
    font-family: "Roboto", Arial, sans-serif;
    font-size: 16px;
}

.container {
    padding: 16px;
    border: 1px solid #ccc;
    background: #eee;
    margin-bottom: 32px;
}

button {
    padding: 4px 8px;
    border: 1px solid #ccc;
    background-color: white;
    border-radius: 3px;
    cursor: default;

}

button:not([disabled]) {
    cursor: pointer;
}

button:not([disabled]): hover {
    background-color: salmon;
    color: white;
}

.highlight {
    font-weight: bold;
}

Answer 1

我不确定发生了什么。但我再次输入所有内容并且有效。我认为某些地方出了问题，我无法抓住。重新编写所有代码。

尝试字符串插值时模板文本消失

1 个答案: