REST $ 리소스 데이터를 $ routeparams로 필터링하십시오.

저는 Angular를 사용하여 몇 페이지에 REST 데이터를 채우고 그 기사에 대한 기사 세부 정보를 표시하는 링크가 필요한 기사 목록을 갖습니다. 기본적으로 전달 된 routeparam을 사용하여 개별 아티클에 사용하는 REST 호출을 필터링해야합니다.

예상대로 routeparam을 전달하는 것처럼 보이지만 내 세부 정보 페이지 (articles.html)에서 작업하기 위해 REST 호출을받는 데 어려움을 겪고 있으며 내 ID가 도착/일치하지 않는 것으로 의심됩니다. routeparam에 의해 전달 된 ID에 대한 REST 호출. 첫 번째 REST 호출은 모든 기사를 나열하는 categories.html 페이지에서 작동합니다. Angular의 ngResource API를 $ resource와 함께 사용하고 있습니다.

app.js (라우팅)

var pfcModule = angular.module('pfcModule', ['ngRoute', 'pfcServices', 'pfcControllers']); 

pfcModule.config(['$routeProvider', function ($routeProvider) { 
$routeProvider. 
    when('/home', { templateUrl: './views/home.html'}). 
    when('/categories', { templateUrl: './views/categories.html', controller: 'pfcCtrl' }). 
    when('/articles/:articleID', { templateUrl: './views/articles.html', controller: 'pfcCtrl2' }). 
    otherwise({ redirectTo: '/home' }); 
}]);

services.js (REST 호출)

var pfcServices = angular.module('pfcServices', ['ngResource']) 

pfcServices.factory('pfcArticles', ['$resource', 
    function($resource){ 
     return $resource('https://pfc.azure-mobile.net/tables/articles/:articleID', {}); 
    }]);

controllers.js (컨트롤러)

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

pfcControllers.controller('pfcCtrl', ['$scope', 'pfcArticles', function ($scope, pfcArticles) { 
$scope.data = pfcArticles.query(); 
}]); 

pfcControllers.controller('pfcCtrl2', ['$scope', '$routeParams', 'pfcArticles', function ($scope, $routeParams, pfcArticles) { 
$scope.data2 = pfcArticles.get({ articleID: $routeParams.articleID }); 
}]);

: 여기에 해당 코드는 categories.html (부분, 예상대로 작동)

,210

<div class="row"> 
<div class="col-md-4"> 
    <h2>Heading</h2> 
    <table class="table table-striped"> 
     <tr> 
      <th>ID</th> 
      <th>Title</th> 
      <th>Category ID</th> 
      <th>Link</th> 
     </tr> 
     <tr ng-repeat="article in data"> 
      <td>{{article.id}}</td> 
      <td>{{article.articletitle}}</td> 
      <td>{{article.articlecategoryid}}</td> 
      <td><a href="#articles/{{article.id}}">Link</a></td> 
     </tr> 
    </table> 
</div>

articles.html (부분, 나는 그것이 routeparam에 의해 전달 된 ID에 의해 필터링 할 예상대로 작동하지 않는) 일부 연구 후

<div class="row"> 
<div class="col-md-4"> 
    <h2>Heading</h2> 
    <table class="table table-striped"> 
     <tr> 
      <th>ID</th> 
      <th>Title</th> 
      <th>Category ID</th> 
      <th>Summary</th> 
     </tr> 
     <tr ng-repeat="article in data2"> 
      <td>{{article.id}}</td> 
      <td>{{article.articletitle}}</td> 
      <td>{{article.articlecategoryid}}</td> 
      <td>{{article.articlesummary}}</td> 
     </tr> 
    </table> 
</div>

출처

2014-12-02 Kode

, 나는 조정 내 articles.html partial은 다음과 같이 반복되지 않으며 작동 중임 :

<div class="row"> 
<div class="col-md-4"> 
    <h2>Heading</h2> 
    <table class="table table-striped"> 
     <tr> 
      <th>ID</th> 
      <th>Title</th> 
      <th>Category ID</th> 
      <th>Summary</th> 
     </tr> 
     <tr> 
      <td>{{data2.id}}</td> 
      <td>{{data2.articletitle}}</td> 
      <td>{{data2.articlecategoryid}}</td> 
      <td>{{data2.articlesummary}}</td> 
     </tr> 
    </table> 
</div>

출처

2014-12-02 22:22:00 Kode

REST $ 리소스 데이터를 $ routeparams로 필터링하십시오.

답변

관련 문제