在ng-show()中计算不工作

Evaluation not working in ng-show()

本文关键字:计算 工作 ng-show      更新时间:2023-09-26

我试图在ng-repeat循环内的<li>标记中放置一个复选标记图标旁边的一些文本。

HTML

<ul>
  <li ng-repeat="nav in tabs.nav">
     {{nav.name}}
     <i class="fa fa-check my-checked-icon"
        ng-show="$index===selectedIndex"
        ng-click="selectNav(nav.index)"></i>
 </li>
</ul>

JS

    $scope.tabs = {
        "navs":[
            {
                "name":"Lorem Ipsum",
                "index":0
            },
            {
                "name":"Adipiscing Elit",
                "index":1
            },
            {
                "name":"Ut Lbore et Dolore",
                "index":2
            }
        ]
    };
    var selectedIndex = 1;
    $scope.selectNav = function(index){
      $scope.selectedIndex = index;
    };
CSS

.my-checked-icon{
  display: none;
}

当我将$indexselectedIndex放入{{}}中时,它们都打印出正确的值。我试过不做大括号以及用==进行评估。

我得到错误

错误:[$parse:lexerr] Lexer错误:表达式[" $index==selectedIndex"]中0-0列["]处的下一个字符意外。

我在其他地方看到过人们这样评估的例子。有什么问题吗?有没有更好的方法在控制器内部实现这个?

试试这个

HTML

<ul>
  <li ng-repeat="nav in tabs.navs" ng-click="selectNav(nav.index)">
     {{nav.name}}
     <i class="fa fa-check my-checked-icon"
        ng-show="$index===selectedIndex"
        ></i>
 </li>
</ul>

JS

var ncolor;
      $scope.tabs = {
        "navs":[
            {
                "name":"Lorem Ipsum",
                "index":0
            },
            {
                "name":"Adipiscing Elit",
                "index":1
            },
            {
                "name":"Ut Lbore et Dolore",
                "index":2
            }
        ]
    };
    $scope.selectedIndex = 1;
    $scope.selectNav = function(index){
      $scope.selectedIndex = index;
    };

验证中没有任何错误。您将selectedIndex声明为变量。您应该定义为$scope变量。只有这样,你才会看到右边的复选图标。我把ng-click移到了

  • 所以当你点击它的时候复选标记就会出现在旁边。如果你点击一个复选标记它就会和索引保持一致你不能点击隐藏的复选标记