AngularJS Ng-repeat 没有按预期工作 [英] AngularJS Ng-repeat is not working as expected

查看:22
本文介绍了AngularJS Ng-repeat 没有按预期工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我遇到了一个奇怪的问题,我可以访问来自我的范围作为数据模型的所有元素,也可以在 Chrome 控制台中看到范围元素,但是当我尝试在 ng-repeat 语句中使用该模型时它不起作用,它只是不循环遍历 vm.menu.items.下面是我的简单代码:

<div ng-controller="app.views.layout.header as vm"><p>{{vm.currentMenuName}} {{vm.menu.items[0].displayName}} {{vm.menu.items[1].displayName}}</p>**<<----- 它有效!**<ul><li ng-repeat="vm.menu.items 中的menuItem"><span>不工作!</span>{{menuItem.displayName}}

我对 angular 还是很陌生,因此将不胜感激为我指明正确方向的任何帮助.

解决方案

我删除了vm".在您的 html 中,一切都按预期工作

<div ng-controller="app.views.layout.header as vm"><p>{{currentMenuName}} {{menu.items[0].displayName}} {{menu.items[1].displayName}}</p><ul><li ng-repeat="menuItem in menu.items"><span>不工作!</span>{{menuItem.displayName}}

http://plnkr.co/edit/1BtC8p1ViqKXSbCWE3Kj?p=preview

或者您可以在您的控制器中使用this"而不是 $scope(参见 http://plnkr.co/edit/1BtC8p1ViqKXSbCWE3Kj?p=preview

I'm having a weird issue, I can access all the elements coming from my scope as data model, also I can see the scope elements in the Chrome console, but when I try using the model within a ng-repeat statement it does not work, it just does not loop through the vm.menu.items. Below is my simple code:

<body ng-controller="mainController">
    <div ng-controller="app.views.layout.header as vm">

        <p>{{vm.currentMenuName}} {{vm.menu.items[0].displayName}} {{vm.menu.items[1].displayName}}</p>  **<<----- IT works!**

        <ul>
            <li ng-repeat="menuItem in vm.menu.items">
                <span>Not working! </span>{{menuItem.displayName}}
            </li>
        </ul>

    </div>
</body>

I'm still pretty new to angular, so any help that point me into the right direction will be greatly appreciated.

解决方案

I removed the 'vm.' in your html and everything works as expected

<body ng-controller="mainController">
   <div ng-controller="app.views.layout.header as vm">

    <p>{{currentMenuName}} {{menu.items[0].displayName}} {{menu.items[1].displayName}}</p>

    <ul>
        <li ng-repeat="menuItem in menu.items">
            <span>Not working! </span>{{menuItem.displayName}}
        </li>
    </ul>

</div>

http://plnkr.co/edit/1BtC8p1ViqKXSbCWE3Kj?p=preview

Or you can us 'this' in your controller instead of $scope (see http://plnkr.co/edit/1BtC8p1ViqKXSbCWE3Kj?p=preview

这篇关于AngularJS Ng-repeat 没有按预期工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆