Ng-repeat 没有在 Flask 应用程序中显示我的项目。答案

【问题标题】：Ng-repeat is not showing my items in a Flask application.Ng-repeat 没有在 Flask 应用程序中显示我的项目。
【发布时间】：2015-07-25 19:42:03
【问题描述】：

ng-repeat 使我的代码崩溃。当我使用 {{item.Title}} 我的应用程序死了。当我使用 {{ item }} 我的应用程序运行时，HTML 标记内出现空白。

<div class="container" ng-app="App"  > 

            <div ng-controller="MainCtrl">

                <div ng-repeat="item in resources" >  

                 <p> {{ item }}  </p> 

                </div> 
        </div>  
</div>

在控制器中：

$scope.resources =  [
                      {
                        "Category":"A",
                        "Topic":"U",
                        "Age":"2",
                        "Title":"13"
                      },
                      {
                        "Category":"A",
                        "Topic":"U",
                        "Age":"3",
                        "Title":"12"
                      }
                      ]

控制器代码如下：

var App = angular.module('App', ['$http']);
console.log(989)


App.controller('MainCtrl', ['$scope', '$http', 
    function($scope, $http) {
        console.log(123456789876543456789)      
        $http.get('../static/js/data.json').success(function(data) {
            $scope.resources = data;

// console.log($scope)
// console.log($scope.resources)
      });
}]);

这是一个使用 partials 的 Flask 应用程序...问题的根源是双花括号。解决了！

【问题讨论】：

没有任何显示可以做到这一点，或者没有向我们展示足够的应用程序听起来你有某种范围问题。创建一个复制问题的演示
开发者控制台（或任何浏览器控制台）中是否显示任何错误？
控制器和模块创建时请显示更多代码？
你能告诉我们控制器的完整代码吗？
那个 data.json 文件到底是什么？我认为错误是无效的 json 语法。

标签： javascript angularjs flask angularjs-ng-repeat ng-repeat

【解决方案1】：

你必须使用 {{ resources.title }} 进行绑定

【讨论】：

title 是item 的一个属性。看看他的ng-repeat 指令。
抱歉，我没有看到您在 ng-repeat 中命名为“资源中的项目”

【解决方案2】：

我已经创建了 JS fiddle 并按预期工作，请查看我的 code

angular.module("App", []).controller('MainCtrl', function ($scope) {
    $scope.resources = [{
        "Category": "A",
            "Topic": "U",
            "Age": "2",
            "Title": "13"
    }, {
        "Category": "A",
            "Topic": "U",
            "Age": "3",
            "Title": "12"
    }]
});

.

$http.get('../static/js/data.json').success(function(data) {
            $scope.resources = data;
            $scope.$apply();
      });

【讨论】：

我知道上面应该可以工作..我以前工作过..我正在使用带有部分的 Flask。上面的代码只是这部分。我只在这个部分加载角度。看到了“项目”，但使用它的属性会导致爆炸。我试图对数据对象进行字符串化，但没有任何好处。
你试过 $scope.$apply() 吗？
是的，它不是 $apply...项目已被应用，但“p”标签为空。

【解决方案3】：

这个解决方案对我有用

var app = angular.module('App', []);

app.controller('MainCtrl', 
      function($scope, $http) {   
        $http.get('../static/js/data.json').success(function(data) {
            $scope.resources = data;
      }); 
});

data.json 文件内容是这样的

[
    {
        "Category":"A",
        "Topic":"U",
        "Age":"2",
        "Title":"13"
    },
    {
        "Category":"A",
        "Topic":"U",
        "Age":"3",
        "Title":"12"
    }
]

【讨论】：

你的 data.json 文件是什么样子的？

【解决方案4】：

Item 是一个对象，而 p 标签想要显示一个字符串。试试

<p>{{item.title}}</p>

【讨论】：

【解决方案5】：

解决办法是：

{% raw %}

item.Title

{% endraw %}

【讨论】：

原始是什么意思？