0

我正在使用 AngularJS,我遇到的是 ng-show 使我的整个 Web 应用程序崩溃。另一方面,使用 ng-hide 效果很好。这是一个代码片段:

Image.get({project_id: $scope.project.id}, function(images_data) {
    $scope.project.images = images_data.images;
    $(document).ready(function() {
        $(".fancybox").fancybox({
            openEffect: 'none',
            closeEffect: 'none'
        });
    });
    display_images();
});

和 HTML:

<div ng-show="project.images.length > 0">

崩溃来了。当我改变ng-show一切ng-show="project.images.length == 0都恢复正常。这只是美学问题,我不介意使用 ng-hide,但我想知道那里发生了什么。谢谢是提前!

@edit 控制台的输出是

Error: Script terminated by timeout at:
display_images/<@127.0.0.1:8000/static/app/js/app.js:50:1
jf/this.$get</n.prototype.$digest@127.0.0.1:8000/static/angularjs-1.4.2/angular.min.js:132:257
jf/this.$get</n.prototype.$apply@127.0.0.1:8000/static/angularjs-1.4.2/angular.min.js:135:267
l@127.0.0.1:8000/static/angularjs-1.4.2/angular.min.js:87:232
F@127.0.0.1:8000/static/angularjs-1.4.2/angular.min.js:91:277
Tf/</K.onload@127.0.0.1:8000/static/angularjs-1.4.2/angular.min.js:92:315
Error: [$rootScope:inprog] http://errors.angularjs.org/1.4.2/$rootScope/inprog?p0=%24digest

我在这里发布了与代码相关的所有内容:http: //pastebin.com/iqx6YsX3

4

3 回答 3

0

怀疑>这里可能会导致问题。

您可以将决定添加到您的控制器中:

$scope.hasImages = function() {
    return $scope.project.images.length > 0;
}

接着:

<div ng-show="hasImages()">
于 2015-07-30T15:09:16.950 回答
0

很可能您正在处理Uncaught ReferenceError: images(or project) in not defined,为了安全起见,您可以使用以下表达式:

<div ng-show="project && project.images && project.images.length > 0">

但如果你想检查长度,这实际上就足够了

<div ng-show="project && project.images && project.images.length">
于 2015-07-30T15:11:02.583 回答
0

ngShow 指令根据提供 true 或 false 值的表达式显示或隐藏给定的 HTML 元素。

无控制流语句:不能在 Angular 表达式中使用以下内容:条件、循环或异常。

您不能在表达式中编写控制流语句。这背后的原因是 Angular 哲学的核心,即应用程序逻辑应该在控制器中,而不是视图中。如果您需要真正的条件、循环或从视图表达式中抛出,请改为委托给 JavaScript 方法。

您可以从这里查看更多信息

如果你想在 UI 中使用表达式你可能会得到项目或图像的 Uncaught ReferenceError 所以应该检查第一个项目然后是图像然后是长度

<div data-ng-show="project && project.images && project.images.length">
于 2015-07-30T15:42:42.093 回答