在ng-repeat中使用ng-if和ng-switch失败

Question

我正在尝试将userId与currentuserId进行比较，当行动条件为approve时，我正在尝试填充复选框。但我的ng-if似乎总是失败。我怎样才能做得更好ng-switch工作正常。我应该采取其他方式吗？当用户和当前用户ID匹配时，我不想启用它们的复选框

<tr ng-repeat="details in searchresponse">
  <td class=list align=center ng-switch="details.action">
    <span ng-switch-when="View">
            <input type="checkbox" name="ent" id="ent" ng-model="details.selected">
        </span>
    <span ng-switch-when="Approve">
        <ng-if='details.UserId' != 'details.currentUserId'><input type="checkbox" name="ent" id="ent" ng-model="details.selected">
     </span>

Answer 1

HTML属性

正如在其他答案中已经说明的那样，您需要在引号中正确地使用HTML属性，以使任何angularJS魔法工作。为此，您应该习惯使用相同类型的引号（通常对任何HTML属性使用双引号"statement"，而使用其他类型（分别为单引号'string'）来包含AngularJS中的字符串语句。

在您的示例中，不需要将变量名称放入其他引号中，因为您不希望将它们作为文字字符串进行求值。

更改

ng-if='details.UserId' != 'details.currentUserId'

到

ng-if="details.UserId != details.currentUserId"

仅将ng-if用作属性

此外，不允许以任何其他方式使用ng-if directive，如任意HTML节点的HTML属性。 （这在其指令定义中用restrict: 'A'表示，它明确地限制了对属性的使用。这将进一步改变你的代码

<ng-if="details.UserId != details.currentUserId">

到

<div ng-if="details.UserId != details.currentUserId">

拥抱HTML标记

示例的<ng-if>标记不会包含任何其他元素，也不会像<input />这样的自动关闭HTML节点。只有少数标签支持这种特殊用途。

隔离ng-if范围

如果您仍然遇到问题，解析AngularJS模板或范围变量，您应该考虑ng-if确实创建了一个独立的范围，因为相关容器对象实际上是从DOM中删除的，或者分别插入到DOM中取决于其条件声明。 （如果您想要阻止大量代码的背景渲染，这可能特别有用。或者您也可能为通常在单页访问中多次显示和隐藏的元素生成大量不必要的高工作负载）

ng-show和ng-hide提供了一种稍微不同的方法，只需隐藏相应的元素（应用标准的CSS display:none属性/类）

Answer 2

而不是

<ng-if='details.UserId' != 'details.currentUserId'><input type="checkbox" name="ent" id="ent" ng-model="details.selected">

DO

<span ng-if="details.UserId != details.currentUserId"><input type="checkbox" name="ent" id="ent" ng-model="details.selected" /></span>

Answer 3

删除连字符'

 <ng-if='details.UserId!=details.currentUserId'>...