javascript - 如何在 AngularJS 中删除 {{expression}} 之前的文本

Question

我在一个简单的想法上遇到了麻烦。当用户单击输入字段以仅显示他们正在输入的文本时，如何删除“Hello”。

我需要保留 H1 标记中的“Hello”，并且仅在用户单击输入字段开始输入时才消失。

<div>
  <label>Name:</label>
  <input type="text" ng-model="yourName" placeholder="Enter a name here">

  <h1>Hello {{yourName}}</h1>
</div>

我尝试使用 jquery 来清空或分离 H1 标签，但这也带走了表达式。

感谢您的帮助。

Answer 1

您可以在绑定(bind)语法中执行此操作:

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>
<div ng-app>
  <label>Name:</label>
  <input type="text" ng-model="yourName" placeholder="Enter a name here">

  <h1>{{yourName || 'Hello'}}</h1>
</div>