Question

我遇到这种情况：我需要在输入文本字段（html）中添加引号而不更改输入的值。我正在使用angular，所以我使用ngModel，它看起来像这样

<input ng-model="data" type="text" />

我希望输入字段显示＆＃34; {{data}}＆＃34;但是变量数据本身保持不变（没有引号）。

我还没有找到任何css / Angular技巧......还有什么想法？

Answer 1

在ng-model="data"中使用<input type="text">将data与整个文本字段绑定在一起。在您只希望文本的一部分（在文本字段中显示）与范围绑定的情况下，这不是特别有用。

例如，如果你这样做

<input type="text" value="prefixText {{name}} suffixText" ng-model="name">

输入框将显示name中的任何内容（没有前缀/后缀文本）

然而，有一个解决方法。对变量使用ng-bind并在value="..."属性中单独提及前缀/后缀文本。

<input type="text" value="prefixText {{name}} suffixText" ng-bind="name">

这是demo

Answer 2

你可以试试这个

<form class="example-form">
  <mat-form-field class="example-full-width">
    <mat-label>Telephone</mat-label>
    <span matPrefix>+1 &nbsp;</span>
    <input type="tel" matInput placeholder="555-555-1234">
    <mat-icon matSuffix>mode_edit</mat-icon>
  </mat-form-field>
</form>

Demo

为输入标记

2 个答案: