Question

在下面的代码中，我从之前存储的localStorage获取环境并将其分配给$ scope.environments。当accessMethod为“A”时，它应显示按钮，当accessMethod为“B”时，它应显示一个下拉列表。

 <form accept-charset="UTF-8" role="form" name="loginForm" ng-controller="PostsCtrl"  novalidate ng-submit="Onsubmit()" >
                    <fieldset>
                        <ul class="heroes" ng-repeat="environment in environments   track by $index" >
                            <li ng-if="environment.accessMethod === 'A'">
                                <button  type="button" class="btn btn-primary" uib-dropdown-toggle ng-disabled="disabled">
                                    <span class="badge">{{environment.code}}</span> 
                                </button>
                            </li>
                            <li ng-if="environment.accessMethod === 'B'">
                                <div class="btn-group" uib-dropdown >
                                    <button  type="button" class="btn btn-primary" uib-dropdown-toggle  ng-disabled="disabled">
                                        <span class="badge">{{environment.code}}</span> <span class="caret"></span><span class="sr-only"></span>
                                    </button>
                                    <ul class="dropdown-menu" uib-dropdown-menu role="menu" >
                                        <li   ng-repeat="roledetail in environment.roles"  
                                              ng-click="onSelect(roledetail.roleName)" >
                                            <a href="" >{{roledetail.roleName}}</a>
                                        </li>
                                    </ul>
                                </div>
                            </li>
                        </ul>


                        </fieldset>
                </form>

$ scope.environments = localStorage.getItem（“environments”）; 我保持Json的理解，但我通过localStorage访问它。

$scope.environments = [{
  "code": "abc",
  "name": null,
  "accessMethod": "A",
  "roles": [{
      "roleId": 1,
      "roleName": "A"
    },
    {
      "roleId": 3,
      "roleName": "B"
    }
  ]
}, {
  "code": "XYZ",
  "name": null,
  "accessMethod": "A",
  "roles": [{
      "roleId": 1,
      "roleName": "A"
    },
    {
      "roleId": 3,
      "roleName": "B"
    }
  ]
}, {
  "code": "Neo",
  "name": null,
  "accessMethod": "B",
  "roles": [{
      "roleId": 1,
      "roleName": "A"
    },
    {
      "roleId": 3,
      "roleName": "C"
    }
  ]
}, {
  "code": "LAB",
  "name": null,
  "accessMethod": "B",
  "roles": [{
      "roleId": 1,
      "roleName": "A"
    },
    {
      "roleId": 3,
      "roleName": "B"
    }
  ]
}]

Answer 1

分配到范围时，你没有做Json.parse。

这样做

$scope.environments = JSON.parse(localStorage.getItem("environments"));

Answer 2

使用ng-show而不是if。 ng-show动态改变元素的可见性，而ng-if决定是否应该渲染该元素。

如何将字符串与ng-if进行比较？

2 个答案: