2017-03-10 6 views
0

角度モジュール「md-data-table」のreadmeには、「$栄養サービスがあるとします。私はサービス(makerService)を追加しようとしましたが、データが返されました。しかし、私は画面に表示されたデータを見ることができません。角度モジュールmd-data-tableのサービス

$makerService.makers.get is not a function 

これは私のJavascriptコードです:

(function() { 

    'use strict'; 

    angular.module('BowbleCRM', [ 
    'ngMaterial', 
    'md.data.table' 
    ]) 
    .service('$makerService', function() { 
    var makers = { 
      "makers" : [ 
       {"full_name": "Jan", "email": "[email protected]"}, 
       {"full_name": "Pieter", "email": "[email protected]"} 
      ] 
      }; 
    return makers; 
    }) 
    .controller('BowbleCRMController', ['$makerService', '$scope', BowbleCRMController]); 

    function BowbleCRMController($makerService, $scope) { 
    'use strict'; 

    $scope.currentNav = 'importeren'; 
     $scope.selected = []; 

     $scope.query = { 
     order: 'full_name', 
     limit: 5, 
     page: 1 
     }; 

     function success(makers) { 
     console.log(makers); 

     $scope.makers = makers; 
     } 
     $scope.getMakers = function() { 
     $scope.promise = $makerService.makers.get($scope.query, success).$promise; 
     }; 
    } 

})(); 

そして、これが私のHTMLの一部であり、私が手にエラーが、私は、さまざまなJSON形式を試してみました。

<md-toolbar class="md-table-toolbar md-default"> 
    <div class="md-toolbar-tools"> 
    <span>Alle makers</span> 
    </div> 
</md-toolbar> 
<!-- exact table from live demo --> 
<md-table-container> 
    <table md-table md-row-select multiple ng-model="selected" md-progress="promise"> 
    <thead md-head md-order="query.order" md-on-reorder="getMakers"> 
     <tr md-row> 
     <th md-column><span>Volledige naam</span></th> 
     <th md-column><span>E-Mail adres</span></th> 
     </tr> 
    </thead> 
    <tbody md-body> 
     <tr md-row md-select="maker" md-select-id="full_name" md-auto-select ng-repeat="maker in makers.data"> 
     <td md-cell>{{maker.full_name}}</td> 
     <td md-cell>{{maker.email}}</td> 
     </tr> 
    </tbody> 
    </table> 
</md-table-container> 
<md-table-pagination md-limit="query.limit" md-limit-options="[5, 10, 15]" md-page="query.page" md-total="{{makers.length}}" md-on-paginate="getMakers" md-page-select></md-table-pagination> 

正しいサービスを行い、角度モジュール「md-data-table」でデータを表示するにはどうすればよいですか?

+1

?現在、$ makerService.makersオブジェクトには "GET"機能はありません。ちょうどfull_nameとemailです。 – SoEzPz

答えて

1

$makerServiceにありません。あなたはオブジェクトであるmakersを返すだけです。

getとお電話する場合は、makerServiceに実装する必要があります。

.service('$makerService', function() { 
    var makers = { 
      "makers" : [ 
       {"full_name": "Jan", "email": "[email protected]"}, 
       {"full_name": "Pieter", "email": "[email protected]"} 
      ] 
      }; 

    function get(params){ 
     //..implement your logic here (for your controller code, this should return a promise) 
    } 
    return { 
     makers: makers, 
     get: get 
    }; 
    }) 

ような何かそして、あなたのコントローラであなたはこのようにそれを呼び出すことができます。あなたの$メーカーサービスに機能を「GET」さ

$scope.getMakers = function() { 
     $scope.promise = $makerService.get($scope.query, success).$promise; 
     };