为什么ng-repeat-start和ng-repeat- end不能正常工作

Why ng-repeat-start and ng-repear-end not working correctly?

本文关键字：常工作 工作 不能 ng-repeat-start ng-repeat- end 为什么      更新时间：2023-09-26

我试图用Angular JS(也使用Laravel)构建一个简单的注释应用程序，这里是一个代码:

<div ng-controller="CommentController">
    <div ng-repeat-start="comment in comments" class="comment">
        <h3>Comment {{ comment.id }} <small>by {{ comment.author }}</small></h3>
        <p>{{ comment.text }}</p>
    </div>
    <div ng-repeat-end></div>
    </div>
</div>

这里是我的JS文件:

function CommentController($scope) {
    $scope.comments = [
        { id: 1 },
        { author: "Artem" },
        { text: "Angular comment" }
    ];
}

输出:

Comment 1 by


Artem评论


评论

角度评论

我使用的是AngularJS 1.2.22，如果这对你有帮助的话。

您的JSON对象可能格式错误。

从你想要达到的，它应该是下面的格式:

$scope.comments = [
    { id: 1, author: "Artem", text: "Angular comment" },
    { id: 2, author: "Other", text: "Other Angular comment" }
];

您的控制器似乎没有注册。你应该这样做:

myApp.controller('CommentController', ['$scope', function($scope) {
    $scope.comments = [
        { id: 1, author: "Artem", text: "Angular comment" },
        { id: 2, author: "Other", text: "Other Angular comment" }
    ];
}]);

只把myApp改成你的模块名

1。这里不需要ng-repeat-start和ng-repeat-end指令。这些指令背后有什么特别的原因吗?

2。可以通过使用ng-repeat来实现。

如果你想使用这两个指令。试试这个

<div ng-controller="CommentController">
    <div ng-repeat-start="comment in comments" class="comment">
        <h3>Comment {{ comment.id }} <small>by {{ comment.author }}</small></h3>
    </div>
    <div ng-repeat-end></div>
          <p>{{ comment.text }}</p>
    </div>
</div>

OR，简单的方法是:

 <div ng-controller="CommentController">
        <div ng-repeat="comment in comments" class="comment">
            <h3>Comment {{ comment.id }} <small>by {{ comment.author }}</small></h3>
             <p>{{ comment.text }}</p>
        </div>
    </div>

角医生

3。您的JSON格式也可能是错误的。Angular将每个值视为对象。如果你想让object有三个值，像这样改变你的JSON。

function CommentController($scope) {
    $scope.comments = [
        { id: 1 ,
         author: "Artem",
         text: "Angular comment" }
    ];
}

@zorza提到的可能也是正确的。

除非在你的代码下面的某个地方你使用了像下面这样的东西:

myApp.controller('CommentController', 'CommentController');
相关文章：