angularjs - my json file does not load in angular js? -


i have basic project in angular js, files

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"          } 

]

the issue angular not load json file in index.html, code in controller.js work fine

optional code

     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" }      ]  }] ) 

i don't know happened, use yeoman , gruntjs

you have misspelled name of file in $http call:

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

should be:

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

if typo in question, please amend question , provide output of console log messages/errors, , confirm see request being made in network tab in chrome/firefox/etc.


Comments

Popular posts from this blog

python - mat is not a numerical tuple : openCV error -

c# - MSAA finds controls UI Automation doesn't -

wordpress - .htaccess: RewriteRule: bad flag delimiters -