Question

要将字段的值转换为显示名称，我将视图中的表达式用作一行。例如，后端发送性别作为＆＃39; M＆＃39;对于男性和＆＃39; F＆＃39;对于女性来说，为此，我将观点写成：

<td>{{ {'M': "Male", 'F': "Femail"} [partB.gender] }}</td>

它工作正常。

我的django模型中有相当数量的choice fields。其中一个是收到true / false的布尔值，并将该字段显示为＆＃34;是＆＃34; /＆＃34;否＆＃34;我在视图中写了表达式：

<td>
 {{ ["No", "Yes"][+partB.is_employee_with_substantial_interest] }}
</td>

但这不起作用。

我认为这可能是.和一元+之间的优先问题，但事实并非如此。检查：

>> var a = {a: true, b: false}
undefined
>> a.a
true
>> +a.a
1

据我所知，JavaScript表达式["No", "Yes"][+partB.is_employee_with_substantial_interest]本身并没有错。

在此问这个问题之前，我试图在plunker

上找出答案

＆＃13;

<html ng-app="myApp" >
<head>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js"></script>
  <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
  <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script>
</head>
<body ng-controller="myCtrl">

  <h1>AngularJS Template Query </h1>

   <h4> JavaScript Working </h4>
   <ul>
   <li id="a"> Grijesh Chauhan  </li>
   <li id="b"> Grijesh Chauhan  </li>
   <li id="c"> Grijesh Chauhan  </li>
   <li id="d"> Grijesh Chauhan  </li>
   <li id="e"> Grijesh Chauhan  </li>
   </ul>

  <div>

  <h4> Angular Code not Working </h4>
  
  <ul>
<li> {{ ["No", "Yes"][+data.b] }} </li>
<li> {{ ["No", "Yes"][+data.a] }} </li>
<li> {{ { true: "Yes", false: "No"}[data.b]  }} </li>
<li> {{ { true: "Yes", false: "No"}[data.a]  }} </li>
<li> {{ { 1: "Yes", 0: "No"}[+data.b]  }} </li>
<li> {{ { 1: "Yes", 0: "No"}[+data.a]  }} </li>
   </ul>
 
  </div>
  
  <script>
 var  data = {a: true, b: false};
 
 document.getElementById('a').innerHTML = ["No", "Yes"][+data.a];
 document.getElementById('b').innerHTML = ["No", "Yes"][+data.b];
 document.getElementById('c').innerHTML = { 1: "Yes", 0: "No"}[+data.b];
 document.getElementById('d').innerHTML = { 1: "Yes", 0: "No"}[+data.a]; 
 document.getElementById('e').innerHTML = { true: "Yes", false: "No"}[data.a]; 
  </script>
  <script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.data = { a: true, b: false };
});
  </script>

</body>

</html>

＆＃13;

Answer 1

Angular有自己的评估功能。他不会在幕后执行eval（）。所以在Javascript中工作的一些东西并不适用于角度表达式。

在oppsite上，一些东西在Angular中起作用，例如在javascript中崩溃

a.b.c.d == true

如果未定义a或b或c，将在JS上崩溃，在角度表达式中这将不需要

a && a.b && a.b.c && a.b.c.d

对于您的问题，您可以尝试

<li> {{ { "true": "Yes", "false": "No"}["\""+data.a+"\""]  }} </li>

或类似的尝试转换字符串中的布尔值。

其他解决方法更常见

<li ng-if="data.a">Yes</li>
<li ng-if="!data.a">No</li>

这在IMO最终更加冗长但更具可读性。

为什么Angular视图中的数组表达式不起作用？

1 个答案: