AngularJS ng-repeat 不起作用 [英] AngularJS ng-repeat not working

查看:27
本文介绍了AngularJS ng-repeat 不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个数据表,我正试图通过 ng-repeat 访问它.我想我的代码中的所有内容都是正确的,但是当我加载页面时,数据没有加载.我不确定我做错了什么.这是我的桌子:

<头><tr><th>订购日期</th><th>零售</th></tr></thead><tr><td>{{ sale.dateOrdered }}</td><td>{{ sale.firstLoadRetail}}</td></tr><tr><th>小计</th></tr></tbody>

这是我的控制器:

(函数(){'使用严格';有角的.module('crm.ma').controller('ReportCtrl', ReportCtrl);函数 ReportCtrl() {var vm = 这个;vm.sale = [{订购日期:'05/10/2015',firstLoadRetail: '75',firstLoadCost: '65',InstantProfitAirTime: '9',InstantProfitSpiff: '59',网络零售:'75',净成本:'7',净利润:'67',计数:'0',账单金额:'45'},{订购日期:'06/22/2015',firstLoadRetail: '85',firstLoadCost: '75',InstantProfitAirTime: '10',InstantProfitSpiff: '86',网络零售:'22',净成本:'8',净利润:'22',计数:'0',账单金额:'35'}];}

我收到错误消息 Argument 'report.controller' is not a function, got undefined.上次我收到此错误消息时,我有一个错字,但这次我没有在代码中看到任何错字.

解决方案

检查下面的工作代码片段 -

angular.module('myApp',[]).controller('myCtrl', ['$scope', function($scope){$scope.sales = [{订购日期:'05/10/2015',firstLoadRetail: '75',firstLoadCost: '65',InstantProfitAirTime: '9',InstantProfitSpiff: '59',网络零售:'75',净成本:'7',净利润:'67',计数:'0',账单金额:'45'},{订购日期:'06/22/2015',firstLoadRetail: '85',firstLoadCost: '75',InstantProfitAirTime: '10',InstantProfitSpiff: '86',网络零售:'22',净成本:'8',净利润:'22',计数:'0',账单金额:'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"><头><tr><th>订购日期</th><th>零售</th></tr></thead>
<tr><td>{{ sale.dateOrdered }}</td><td>{{ sale.firstLoadRetail}}</td></tr><tr><th>小计</th></tr></tbody>

希望这能解决您的问题!

Hi I have a table of data that I'm trying to access via ng-repeat. I think I've got everything correct in my code, but when I load the page the data doesn't load. I'm not sure what I'm doing wrong. Here is my table:

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

Here is my controller:

(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'
        }
    ];
}

I'm getting the error message Argument 'report.controller' is not a function, got undefined. Last time I got this error message I had a typo, but I'm not seeing any typos in my code this time.

解决方案

check below working code snippet -

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>

Hope this will solve you problem!

这篇关于AngularJS ng-repeat 不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆