Question

在视图中

 <fieldset>
                         <legend>Projects:</legend>
                            <label>Total: {{projectsData.totalProjects}}</label> <br>
                            <label>Create: {{projectsData.createdProjects}}</label> <br>
                            <label>Open: {{projectsData.openProjects}}</label> <br>
                            <label>Completed: {{projectsData.completedProjects}}</label> <br>
                            <label>Accepted: {{projectsData.acceptedProjects}}</label> <br>



                    </fieldset>

在控制器中

    app.controller('dashboardConroller', ['$scope', '$http', function($scope, $http){

        var userDashboardService = dashboardService($http);

        $scope.projectsData = [
{  
    "totalProjects": "20",
   "createdProjects":"2",
   "openProjects":"3",
   "completedProjects":"5",
   "acceptedProjects":"10"
}
];

    }])

在视图中我没有得到任何东西，JSON中的数据没有显示出来。我不知道为什么？

Answer 1

您的projectsData是一个对象数组。

您必须使用索引才能访问。

试试这个

 <label>Total: {{projectsData[0].totalProjects}}</label> <br>
<label>Create: {{projectsData[0].createdProjects}}</label> <br>
<label>Open: {{projectsData[0].openProjects}}</label> <br>
<label>Completed: {{projectsData[0].completedProjects}}</label> <br>
<label>Accepted: {{projectsData[0].acceptedProjects}}</label> <br>

的 DEMO

Answer 2

使用ng-repeat显示数据。因为你有对象数组：

 <div ng-repeat="x in projectsData">{{x.totalProjects}}</div>

Answer 3

您的$scope.projectsData是一个数组。使它成为下面的对象

$scope.projectsData = {  
   "totalProjects": "20",
   "createdProjects":"2",
   "openProjects":"3",
   "completedProjects":"5",
   "acceptedProjects":"10"
}

在此之后它将按预期工作。

Answer 4

$scope.projectsData是对象数组。

如果你想使用obejct数组，那么你可以使用[ng-repeat][1]来完成。

e.g。

<p ng-repeat="project in projectsData">
 <label>Total: {{project .totalProjects}}</label> <br> 
<label>Create: {{project .createdProjects}}</label> <br> 
<label>Open: {{project .openProjects}}</label> <br> 
<label>Completed: {{project .completedProjects}}</label> <br>
 <label>Accepted: {{project .acceptedProjects}}</label> <br
</p>

如果你没有使用obejct数组，那么你的对象应该是这个

 $scope.projectsData =  {  
    "totalProjects": "20",
   "createdProjects":"2",
   "openProjects":"3",
   "completedProjects":"5",
   "acceptedProjects":"10"
};

因此，您的HTML无需更改即可使用。

<label>Total: {{projectsData.totalProjects}}</label> <br> 
<label>Create: {{projectsData.createdProjects}}</label> <br>
<label>Open: {{projectsData.openProjects}}</label> <br>
<label>Completed: {{projectsData.completedProjects}}</label> <br>
<label>Accepted: {{projectsData.acceptedProjects}}</label> <br>

无法将控制器中的数据读入视图

4 个答案: