AngularJS ng-repeat不起作用

时间:2015-10-15 15:43:27

标签: angularjs angularjs-ng-repeat

嗨,我有一张数据表,我试图通过ng-repeat访问。我认为我的代码中的所有内容都是正确的,但是当我加载页面时,数据无法加载。我不确定我做错了什么。这是我的表:

<table class="table table-bordered table-hover table-responsive" 
       ng-repeat="sale in vm.sales">
<thead>

    <tr>
        <th>
            Date Ordered
        </th>
        <th>
            Retail
        </th>           
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            {{ sale.dateOrdered }}
        </td>
        <td>
            {{ sale.firstLoadRetail}}
        </td>
    </tr>
    <tr>
        <th>
            Subtotal
        </th>
    </tr>
</tbody>

这是我的控制器:

(function () {

'use strict';

angular
  .module('crm.ma')
  .controller('ReportCtrl', ReportCtrl);


function ReportCtrl() {
    var vm = this;

    vm.sale = [
        {
            dateOrdered: '05/10/2015',
            firstLoadRetail: '75',
            firstLoadCost: '65',
            instantProfitAirTime: '9',
            instantProfitSpiff: '59',
            netRetail: '75',
            netCost: '7',
            netProfit: '67',
            count: '0',
            billAmount: '45'
        },
        {
            dateOrdered: '06/22/2015',
            firstLoadRetail: '85',
            firstLoadCost: '75',
            instantProfitAirTime: '10',
            instantProfitSpiff: '86',
            netRetail: '22',
            netCost: '8',
            netProfit: '22',
            count: '0',
            billAmount: '35'
        }
    ];
}

我收到错误消息Argument&#39; report.controller&#39;不是一个功能,未定义。上次我收到此错误消息时出现了错字,但这次我的代码中没有看到任何拼写错误。

2 个答案:

答案 0 :(得分:3)

检查以下工作代码段 -

angular
.module('myApp',[])
.controller('myCtrl', ['$scope', function($scope){

  $scope.sales = [
        {
            dateOrdered: '05/10/2015',
            firstLoadRetail: '75',
            firstLoadCost: '65',
            instantProfitAirTime: '9',
            instantProfitSpiff: '59',
            netRetail: '75',
            netCost: '7',
            netProfit: '67',
            count: '0',
            billAmount: '45'
        },
        {
            dateOrdered: '06/22/2015',
            firstLoadRetail: '85',
            firstLoadCost: '75',
            instantProfitAirTime: '10',
            instantProfitSpiff: '86',
            netRetail: '22',
            netCost: '8',
            netProfit: '22',
            count: '0',
            billAmount: '35'
        }
    ];

 
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">



<div ng-controller="myCtrl">
  <table class="table table-bordered table-hover table-responsive" ng-repeat="sale in sales">
<thead>

    <tr>
        <th>
            Date Ordered
        </th>
        <th>
            Retail
        </th>           
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            {{ sale.dateOrdered }}
        </td>
        <td>
            {{ sale.firstLoadRetail}}
        </td>
    </tr>
    <tr>
        <th>
            Subtotal
        </th>
    </tr>
</tbody>
</div>
</div>

希望这能解决你的问题!

答案 1 :(得分:2)

问题似乎是你在控制器中将变量名称作为vm.sale并在html(额外的s)中循环通过vm.sales