2

在我正在开发的 webapp 中，我试图将 ng-switch 嵌套在 ng-switch 内（在 ng-repeat 内），并发现内部开关评估没有发生。

在下面的缩减示例中（以及在 Plunker 上），我希望看到：

  • 一个
  • 乙
  • D
  • G
  • H

但我实际看到的是：

  • 一个
  • 乙
  • （没有什么）
  • （没有什么）
  • H

<div ng-switch on="el.n1.hasOwnProperty('n2')">在使用 Firebug 进行检查时，第 3 和第 4 个字段在div之外没有子 项。

对于使用 hasOwnProperty，我深表歉意，但我正在处理一些带有可选字段的 JSON。如果有更好的方法来打开一个字段的存在，我会全神贯注。

<!doctype html>
<html lang="en" ng-app>
<head>
        <meta charset="UTF-8"/>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
        <script>
            function TestController($scope)
            {
                $scope.testExample = [
                    { n : "A" },
                    { n : "B" },
                    {
                        n : "C",
                        n1 : { x : "D" }
                    },
                    {
                        n : "E",
                        n1 :
                        {
                            x : "F",
                            n2 : { y : "G" }
                        }
                    },
                    { n : "H" }
                ];
            }
        </script>
</head>

<body ng-controller="TestController">

    <ul ng-repeat="el in testExample">
        <li ng-switch on="el.hasOwnProperty('n1')">
            <div ng-switch-when="true"> 

                <div ng-switch on="el.n1.hasOwnProperty('n2')">
                    <div ng-switch-when="true">
                        {{el.n1.n2.y}}
                    </div>

                    <div ng-switch-default>
                        {{el.n1.x}}
                    </div>
                </div>

            </div>

            <div ng-switch-default> 
                {{el.n}}
            </div>
        </li>
    </ul>
</body>
</html>

感激地收到任何帮助。

4

1 回答 1

3

You can try to use Object.keys(el).indexOf('n1') > 0 instead of hasOwnProperty

<ul ng-repeat="el in testExample">
    <li ng-switch on="Object.keys(el).indexOf('n1') > 0">
        <div ng-switch-when="true">
            <div ng-switch on="Object.keys(el.n1).indexOf('n2') > 0">
                <div ng-switch-when="true">{{el.n1.n2.y}}</div>
                <div ng-switch-default>{{el.n1.x}}</div>
            </div>
        </div>
        <div ng-switch-default>{{el.n}}</div>
    </li>
</ul>

In the controller, don't forget this line

$scope.Object = Object;
于 2013-09-23T14:12:01.300 回答