ng-repeat不起作用,但可以在页面上获取$ scope.items项

时间:2015-02-28 09:42:16

标签: javascript angularjs

我使用angular.js和require.js编写了一个Web应用程序。 但 ng-repeat 不起作用! Chroem只是在使用开发人员工具时显示注释。

HTML代码:

<div class="over-layout">
     <ul class="list">
        <li ng-repeat="item in items" >
            {{item}}
        </li>  
    </ul>
</div>
<div id="page">
    <div class="header">{{title}}</div>
    <div class="page-view" ng-view></div>
    <div id="footer">
      参考: <a href="http://tutorials.jenkov.com/svg/simple-svg-example.html" title="Github">jenkov.com</a>
        {{items[0].title}}
   </div>
</div>

JS代码:

    app.controller('HomeCtrl', function ($scope) {
        // 文章目录


        $scope.index = 0;
        $scope.title = '开始学习SVG';
        $scope.items = [
            {
                'title': '开始学习SVG',
                'hash': 'home'
            },
            {
                'title': 'svg与g标签',
                'hash': 'svg-el-and-g'
            }

        ];



    $scope.MAX = $scope.items.length;

    $('.bt-menu-trigger').toggle(function(){
        $(this).parent().addClass('bt-menu-open');
        $('.over-layout').addClass('active');
    },function(){
        $(this).parent().removeClass('bt-menu-open');
        $('.over-layout').removeClass('active');
    });

    $scope.select = function($e,item){
        $scope.title = $scope.list[item].title;    
    }


});

chrome显示:

   <div class="over-layout">
        <ul class="list">
            <!-- ngRepeat: item in items -->  
        </ul>
    </div>

谢谢!

3 个答案:

答案 0 :(得分:1)

看起来您的当前范围中没有可用的项目对象。我不知道你在哪里包括控制器。尝试用以下内容包装整个html块:

<div data-ng-controller="HomeCtrl">
    <!-- your existing content -->
</div>

答案 1 :(得分:0)

您可以尝试:

<li data-ng-repeat="item in items" >
        {{item.title}}
        {{item.hash}}
</li>  

感谢。

答案 2 :(得分:0)

<div class="over-layout">
     <ul class="list" ng-repeat="item in items">
        <li>
            {{item}}
        </li>  
    </ul>
</div>

请做出这个改变让我知道......我希望这对你有所帮助..