我的json文件没有加载角度js?

时间:2014-12-06 03:40:59

标签: json angularjs routes

我在角度js中有一个基本项目,有这个文件

的index.html

 <div class="portfolio" ng-controller="portfolio-controller">
                <h3>Latest Works</h3>
                            <div class="col-md-6" ng-repeat="prt in portlist">
                                <div class="box-portfolio">
                                        <div class="ps">
                                            <div class="lp"><a href="#/{{ prt.id }}"><i class="fa fa-chevron-down"></i></a></div>
                                        </div>
                                        <div class="box-descrip">
                                                <h4>{{prt.title}}</h4>
                                                <p>{{ prt.id }}</p>
                                                <p>{{prt.descrip}}</p>
                                        </div>
                                    <div class="back-sw"></div>                                       
                                    <img ng-src="images/misc/{{prt.img}}" alt="">
                                </div>
                            </div>
                     </div>

controler.js -

var AppStart = angular.module('apps', ['ngRoute'])
AppStart.controller('portfolio-controller', function ($scope, $http){
          $http.get('app/portfolio.json').success(function(data) {
            $scope.portlist = data; 
          });
        });

portfolio.json -

[
        {
            id: "project_1", 
            title: "project1",
            img: "work1.jpg", 
            descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu"
         },
        { 
            id: "project_2", 
            title: "project2", 
            img: "work2.jpg", 
            descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" 
        },
        {
             id: "project_3", 
             title: "project3", 
             img: "work3.jpg", 
             descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" 
         },
        {
             id: "project_4", 
             title: "project4", 
             img: "work4.jpg", 
             descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" 
         },
        { 
            id: "project_5", 
            title: "project5", 
            img: "work5.jpg", 
            descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" 
        },
        { 
            id: "project_6", 
            title: "project6", 
            img: "work6.jpg", 
            descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" 
        }

问题是角度没有加载index.html中的json文件, 但是在controller.js中使用此代码可以正常工作

可选代码

     AppStart.controller( 'portfolio-controller', ['$scope', function($scope){

   $scope.portlist = [
        { id: "project_1", title: "project1", img: "work1.jpg", descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" },
        { id: "project_2", title: "project2", img: "work2.jpg", descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" },
        { id: "project_3", title: "project3", img: "work3.jpg", descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" },
        { id: "project_4", title: "project4", img: "work4.jpg", descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" },
        { id: "project_5", title: "project5", img: "work5.jpg", descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" },
        { id: "project_6", title: "project6", img: "work6.jpg", descrip: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam earu" }

    ]

}] )

我不知道发生了什么,我使用自耕农和gruntjs

1 个答案:

答案 0 :(得分:0)

您在$ http电话中错误拼写了该文件的名称:

$http.get('app/ortfolio.json').success(function(data) {

应该是:

$http.get('app/portfolio.json').success(function(data) {

如果这只是您问题中的拼写错误,请修改您的问题并提供任何控制台日志消息/错误的输出,并确认您在Chrome / Firefox /等的“网络”标签中看到了正在发出的请求。