2017-07-12 45 views
-1

我正在嘗試用Angularjs設計一個動態表,並且我發現有用的ng-repeat函數。錶行中的ng-repeat沒有顯示行

一些嘗試後,我不知道它是如何不工作,因爲我的屬性效果很好,但我並沒有顯示任何

,這裏是我的.js

.controller('DispatcherFilterController', 
     [ '$scope', 
function($scope,{ 
      $scope.dispatcherSearch=[{ 
        id: 1, 
        name: 'out1', 
        description :'desc1', 
        vat_number :'378297', 
        dispatch_type :'daily', 
        output : 'out1' 
       }, { 
        id: 2, 
         name: 'out2', 
         description :'desc2', 
         vat_number :'3782f97', 
         dispatch_type :'daily', 
         output : 'out2' 
       }, 
       { 
        id: 3, 
         name: 'out3', 
         description :'desc3', 
         vat_number :'fssfes', 
         dispatch_type :'daily', 
         output : 'out3' 
       }];}]) 

,這裏是我的HTML :

<div class="table-responsive"> 
    <table class="table" ng-controller="DispatcherFilterController"> 
     <thead> 
      <tr> 
       <th class="col-order"><a class="sort asc" href="#" title="">{{'NAME' 
            | translate}}</a> 
       </th> 
       <th class="col-order"><a class="sort asc" href="#" title="">{{'DESCRIPTION' 
            | translate}}</a> 
       </th> 
       <th class="col-order"><a class="sort asc" href="#" title="">{{'VAT_NUMBER' 
            | translate}}</a> 
       </th> 
       <th class="col-order"><a class="sort asc" href="#" title="">{{'DISPATCH_TYPE' 
            | translate}}</a> 
       </th> 
       <th class="col-order"><a class="sort asc" href="#" title="">{{'OUTPUT' 
            | translate}}</a> 
       </th> 
       <th class="colf-cmd"></th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="row in dispatcherSearch"> 
       <td>{{row.name}}</td> 
       <td>{{row.description}}</td> 
       <td>{{row.vat_number}}</td> 
       <td>{{row.dispatch_type}}</td> 
       <td>{{row.output}}</td> 
       <td class="colf-cmd"> 
        <div class="form-inline pull-right"> 
         <div class="form-group"> 
          <div class="form-btn-container"> 
           <button type="button" class="btn btn-primary pull-right" ng-click="spot()">{{'SPOT' | translate}}</button> 
          </div> 
         </div> 
         <div class="form-group"> 
          <div class="form-btn-container"> 
           <button type="button" class="btn btn-primary pull-right" ng-click="periodic()">{{'PERIODIC' | translate}}</button> 
          </div> 
         </div> 
        </div> 

       </td> 

      </tr> 
     </tbody> 
    </table> 

我哪裏出錯了?

+0

任何控制檯錯誤? –

回答

2

有在控制器代碼語法錯誤。你也沒有給出任何translate過濾器的代碼,所以我也刪除了,我們在這裏有一個工作Solution

控制器

.controller('DispatcherFilterController', ['$scope', 
      function($scope) { 
       $scope.dispatcherSearch = [{ 
        id: 1, 
        name: 'out1', 
        description: 'desc1', 
        vat_number: '378297', 
        dispatch_type: 'daily', 
        output: 'out1' 
       }, { 
        id: 2, 
        name: 'out2', 
        description: 'desc2', 
        vat_number: '3782f97', 
        dispatch_type: 'daily', 
        output: 'out2' 
       }, { 
        id: 3, 
        name: 'out3', 
        description: 'desc3', 
        vat_number: 'fssfes', 
        dispatch_type: 'daily', 
        output: 'out3' 
       }]; 
      }]); 
0

你忘了完成控制器功能 這裏校正控制器代碼Jsfiddle

JS代碼

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

app.controller('DispatcherFilterController', ['$scope', 
    function($scope) { 
    $scope.dispatcherSearch = [{ 
     id: 1, 
     name: 'out1', 
     description: 'desc1', 
     vat_number: '378297', 
     dispatch_type: 'daily', 
     output: 'out1' 
    }, { 
     id: 2, 
     name: 'out2', 
     description: 'desc2', 
     vat_number: '3782f97', 
     dispatch_type: 'daily', 
     output: 'out2' 
    }, { 
     id: 3, 
     name: 'out3', 
     description: 'desc3', 
     vat_number: 'fssfes', 
     dispatch_type: 'daily', 
     output: 'out3' 
    }]; 
    } 
]); 

這將工作