Question

我是AngularJS的新手。我有一个简单的场景如下

如果在ng-modal定义的输入中没有指定值，则应将输出显示为

Hi

但是当输入中指定的某些值显示为

时

Hi (Jack)

我试过这种方式

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app>
<div>Hi {{(username)}}</div>
<input type='text' ng-model='username'>
  </div>

＆＃13;

但它没有显示我在表达式 {{（username）}} 中指定的括号。

那我怎么能做到这一点。

Answer 1

<div>Hi <span ng-if='username'>({{username}})</span></div>

Answer 2

您需要在括号周围添加引号，因为它们是您要在输入之前和之后添加的字符串。为了确保在输入为空时我们什么都不显示，我们首先检查用户名是否存在。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app>
<div>Hi {{username ? '(' + username + ')' : ''}}</div>
<input type='text' ng-model='username'>
  </div>

＆＃13;

Answer 3

这里我修改了一些代码并且它正常工作

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app>
<div>Hi <span ng-show='username.length > 0'>({{username}})</span></div>
<input type='text' ng-model='username'>
  </div>

＆＃13;

绑定时将括号附加到angularjs变量值

3 个答案: