在angularjs中使用ng-repeat列出树结构时出错

时间:2015-04-18 19:20:58

标签: javascript html angularjs tree angularjs-ng-repeat

我正在尝试使用ng-repeat

列出html上的嵌套字典

以下是完整的code

但似乎我无法通过

访问字典键的值
tree.value

因为它没有显示或只会打印

'tree.value'

有人能帮助我吗?

<div ng-app>
  <script type="text/ng-template" id="myTemplate">
      <li>X</li>
      <p>1 tree.value</p>
      <ul ng-repeat="tree in tree.children" ng-include="'myTemplate'">
          <p>2 tree.value</p>
      </ul>
  </script>
 <div>
     <ul ng-include="'myTemplate'"
    ng-init="tree = 
               {
        children: 
            [
                {children: [], value: c12}, 
                {
                    children: 
                        [
                            {children: [], value: c112}, 
                            {children: [], value: c111}
                        ],
                    value: c11
                }
            ], 
        value: c1
    }
"></ul>
  </div>
</div>

2 个答案:

答案 0 :(得分:1)

你的json被错误地定义了,你应该总是将字符串值包含在单引号'中,如value: c111&amp; value: 'c112'值应为value: 'c111'&amp; value: 'c112'

<强>标记

    <ul ng-include="'myTemplate'"
        ng-init="tree = 
                   {
            children: 
                [
                    {children: [], value: 'c12'}, 
                    {
                        children: 
                            [
                                {children: [], value: 'c112'},
                                {children: [], value: 'c111'}
                            ],
                        value: c11
                    }
                ], 
            value: c1
        }
"></ul>

更好的是在tree内定义$scope变量,而不是在html上定义。

Working JSFiddle

答案 1 :(得分:0)

似乎c1是对象而不是string.so c1具有属性。例如c1具有text属性。

你应该写模板{{tree.value.text}}