标签: angularjs-ng-repeat

我试图通过指令更改控制器范围,但它不会更改.

当我通过指令更改模型时,goas将自动更改$scope.modulesin MyCtrl:

link: function (scope) {
    scope.module.title += ' changed';

    scope.module = {
        title: 'Redeclared'
    };
},

这段代码完美无缺 scope.module.title += ' changed';

但这不是: scope.module = { title: 'Redeclared' };

在$ http.get请求之后,我们有一个对象,{title: 'Redeclared'}这就是为什么我这样做scope.module = { title: 'Redeclared' };

示例:http://jsfiddle.net/8Va9Q/

知道怎么做吗？谢谢

我是angularjs的新手并且正致力于创建示例应用程序.我正在使用ng-repeat指令.我的控制器看起来像这样:

app.controller('CustomerController',function ($scope) {
    $scope.customers = [{ Name: 'Emp One' }, { Age: 10 }, { Salary: 100000000 },
    { Name: 'Emp Two' }, { Age: 20 }, { Salary: 2000000 },
    { Name: 'Emp Three' }, { Age: 30 }, { Salary: 300000000 }];

    $scope.AddCustomer = function() {
        $scope.customers.push($scope.NewCutomer.Name, $scope.NewCutomer.Age, $scope.NewCutomer.Salary);
    };
})

现在在视图中我只是打印输出.

<div ng-repeat="cust in customers">
    <p>Name:   {{cust.Name}}  Age:  {{cust.Age}}   Salary: {{cust.Salary}}</p>   
</div>

看下面的图像,而不是产生3行,系统产生9行.

我希望输出像

Name: EmpOne Age: 10 Salary: 10000000
Name: EmpTwo Age: 30 …

我对来自$ http请求的数组进行了ng-repeat.我有一个设置来显示我的网站上的数组的所有细节.

<div ng-repeat="i in data">
  <h2 id="price">€ {{i.total_price.EUR}}</h2>
  <div class="col-md-12" >
     {{i.changes}}
  </div>
</div>

data是请求中数组的名称.i.changes给了我一个号码.但是,我希望i.changes输出这个数字,除非有数字0,然后我希望它输出'none'而不是0.我将如何进行？

我有一个来自AZ的数组列表,并从中创建一个按钮列表

$scope.alphabet = "abcdefghijklmnopqrstuvwxyz".split("");

我有另一个阵列

$scope.uniqChar = ['a', 'g', 'm'];

通过使用这个数组我想创建一个按钮列表,其中所有按钮禁用除了按钮这些名称是'a','g','m'(在$ scope.uniqChar中).我做了这个jsfiddle,但输出显示了三次.我只希望在一个列表中.请赐教.

我目前正在使用角度ng-repeat.

当用户点击"下一步15"的按钮时,我想显示下15个项目.我不想从数组中弹出项目,我只想隐藏前15个,并将show限制为接下来的15个.

此外,当用户点击"上一页15"时,我只想显示前15个项目.

这是我到目前为止:

HTML:

<div ng-controller="ctrlIndex as vm">


    <ul ng-repeat=" item in vm.items | limitTo: 15 * vm.page
                                 | limitTo: 15 * vm.page < count ? limitTo: 15 * vm.page : 15 - (15 * vm.page - count)"/>
        <li>{{ item }}</li>
    </ul>
<div><button ng-click="vm.next()">Next 15</button></div>
<div><button ng-click="vm.back()">Prev 15</button></div>

使用Javascript:

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

 3app.controller('ctrlIndex', function(){

    var vm = this;
    vm.numRecords = 15;
    vm.page = 1;

    vm.items = []
    for (var i = 0; i < 1000000; ++i) { …

我如何使用 ng-repeat 在 UI 上使用 angularJS 迭代来自服务器的 JSON 响应？

$scope.data = {
  "Home Needs": [{
    "id": 11,
    "itemName": "PARLE G 500 Grams",
    "itemPrice": 50,
    "minSellPrice": 45,
    "discount": 0,
    "store": "Home Needs"
  }],
  "SRI SAI Store": [{
    "id": 1,
    "itemName": "PARLE G 500 Grams",
    "itemPrice": 50,
    "minSellPrice": 45,
    "discount": 0,
    "store": "SRI SAI Store"
  }],
  "Ashirwad": [{
    "id": 10,
    "itemName": "PARLE G 500 Grams",
    "itemPrice": 50,
    "minSellPrice": 46,
    "discount": 0,
    "store": "Ashirwad"
  }]
}

任何人都可以帮助我使用 jsfiddle 或指针吗？

谢谢

产品有4种不同的类别.我想把它们分为3部分.如何用angularjs做到这一点？我想根据产品类别重复ng-repeat.

请检查我的plnkr:http://plnkr.co/edit/XdB2tv03RvYLrUsXFRbw？p = preview

var product = [

  {
    "name": "Item 1",
    "dimension": {
      "height": "4 in",
      "width": "3 in"
    },
    "category": "A"
  }, {
    "name": "Item 2",
    "dimension": {
      "height": "2 in",
      "width": "6 in"
    },
    "category": "B"
  }, {
    "name": "Item 3",
    "dimension": {
      "height": "2 in",
      "width": "3 in"
    },
    "category": "C"
  }, {
    "name": "Item 4",
    "dimension": {
      "height": "5 in",
      "width": "2 in"
    },
    "category": "D"
  }

];

我有一个嵌套的ng-repeat如下:

<div ng-repeat="item_l in list1">
    <div ng-repeat="item_f in list2">
        {{item_f}} {{item_l}}
    </div>
</div>

它给了我大约20个结果,但我只想要其中的5个.这该怎么做？

我调用一个返回单个对象的API端点.我想循环一个名为video存储在对象中的数组,并将存储在数组中的所有链接返回给视图.

从API返回的JSON对象

HTML代码

<div class="myVideo" ng-repeat="v in courses.video">
     <iframe width="560" height="315" ng-src="{{'v.video'}}" 
      frameborder="10" allowfullscreen></iframe>
</div>

用于API调用的控制器中的函数

$scope.getCourse = function(id){
        coursesFac.getCourseById(id)
            .then(function (response) {
                $scope.courses = response.data;
                var items =response.data;
                console.log(items);
                //console.log($scope.courses.video);
            }, function (error) {
                $scope.status = 'Unable to load course data: ' + error.message;
                console.log($scope.status);
            });
    };

视频应显示的视图上会显示此错误

我是AngularJS的新手,我想计算时间差two datetime object with format:

小时:分钟:秒

但我希望及时获得两位数输出:

预期输出:00:00:04

输入:

StartDate=2016-06-29 15:52:32.360

EndDate=2016-06-29 15:53:36.970

Expected output: 00 : 01 : 04

这是我的代码:

public class User
{
      public int Id { get; set; }
      public Nullable<System.DateTime> StartDateTime { get; set; }
      public Nullable<System.DateTime> EndDateTime { get; set; }
}

Json output:

[
  {
    "Id": 121,
    "StartDateTime": "\/Date(1467195752360)\/",  //2016-06-29 15:52:32.360
    "EndDateTime": "\/Date(1467195756970)\/", //2016-06-29 15:53:36.970
  },
  {
    "Id": 122,
   "StartDateTime": "\/Date(1467195752360)\/",// 2016-06-29 15:52:32.360

    "EndDateTime": "\/Date(1467195758360)\/", //2016-06-29 15:53:36.970
  }
]

码:

 <td  ng-repeat="item …

我在这里有这个plunkr ,它显示了一个可编辑的表格.

以下是表格的HTML代码:

  <body ng-controller="MainCtrl">
    <table style="width:100%">
  <tr>
    <th>Name</th>
    <th>Is enabled?</th>        
    <th>Points</th>
  </tr>
  <tr ng-repeat="fooObject in fooObjects | orderBy:'points'">
    <td><input ng-model="fooObject.name" ng-disabled="fooState!='EDIT'"/></td>
    <td><input ng-model="fooObject.isEnabled" ng-disabled="fooState!='EDIT'"/></td>     
    <td><input ng-model="fooObject.points" ng-disabled="fooState!='EDIT'"/></td>
    <td>
      <a href="#" ng-click="handleEdit(fooObject, 'EDIT', $index)">Edit</a>
      <a href="#" ng-click="handleEditCancel(fooObject, 'VIEW', $index)">Cancel</a>
    </td>
  </tr>
</table>
  </body>

我希望Cancel行中的链接显示前一个状态,fooObject就好像该行从未被触及一样.

以下是AngularJS控制器中的代码,它似乎只要我"orderBy:'points'"在ng-repeat表达式中没有,但是不起作用:

app.controller('MainCtrl', function($scope) {
  $scope.fooObjects = [
    {"name": "mariofoo", "points": 65, "isEnabled": true}, 
    {"name": "supermanfoo", "points": 47, "isEnabled": false}, 
    {"name": "monsterfoo", "points": 85, "isEnabled": true}
    ]; …

我需要重复特定元素一定次数,而不是重复所有元素.

<div ng-repeat='el in elements'>
    <div>{{el.someValue}}</div>//repeat here only 3 times 
    <div>{{el.someValue}}</div>// repeat here only 2times something like this
</div>

我可以这样做吗？