标签: angularjs-ng-repeat

我有一个具有"类别"属性的对象数组.在我的ng-repeat中,我通过有条件地显示带有类别名称的标题行来创建一个组,如果它与前一个值不同,则使用它items[$index - 1]来检查前一个值.这可行,但如果我应用orderBy过滤器,似乎$ index不反映新订单.我究竟做错了什么？

我试图了解如何使用多个ng-repeat-end's。

我有一个表格，显示了 20 年的数据，分为 5 年的块。

表中的每一行都显示了 5 年的数据。这就是我展示前 1-5 年的方式。

<table>
    <tbody>
        <tr ng-repeat="history in HistoryCategory.Category[key]">
            <th>{{ history.CompanyName }} 1-5 years</th>
            <td ng-repeat="mycredits in history.Histories.slice(0, 5)" ng-switch="mycredits.Status">
                <span ng-switch-when="0">Some text</span>
                <span ng-switch-when="1">Some text</span>
                <span ng-switch-when="2">Some text</span>
                <span ng-switch-when="3">Some text</span>
                <span ng-switch-when="4">Some text</span>
                <span ng-switch-when="null">null</span>
                <span ng-switch-default>Error</span>
            </td>                
        </tr>
    </tbody>
</table>
<div ng-repeat-end class="scroll-btns">
    <div class="scroll-btns">
        <div class="scroll-left icon-left" ng-click="scrollLeft()"></div>
        <div class="scroll-right icon-right" ng-click="scrollRight()"></div>
    </div>
</div>

在表格的底部是一个DIVwith class scroll-btns.. 所有这些都是允许上面的表格可以滚动并显示一些向左/向右移动的图标。

我现在想要做的是展示第 6-10、11-15 和 16-20 年（在同一张表中）。我试过了： …

假设我有一系列字符串,如["别担心","担心","永远快乐,不要担心"]

当我搜索担心时,使用ng-repeat上的默认搜索过滤器,它给了我所有三个结果,而不管在搜索字符串中担心的位置.

我正在尝试为ng-repeat创建一个自定义搜索过滤器,以便在搜索时我应该根据原始字符串中"忧虑"的位置对结果进行排序.

因此,在上面的数组中搜索单词"忧虑"时,我的预期输出将是["担心","不要担心","永远快乐,不要担心"].

这可能吗？

尝试使用分隔符（'|'）构建字母菜单，如下所示

一个 | 乙 | C | D | E | F | G | H | 我| J | 克| 升| 男 | 否 | 哦| P | 问 | R | | | T | 你| V | W | X | 是 | Z

我在做正确的事吗？有没有更好的方法在 angularJS 中使用分隔符重复项目？请指导我。

<div ng-app="myApp">
  <div ng-controller="myController as vm">
    <span ng-repeat="item in vm.menuItems">
      <a href="#">{{item}}</a>&nbsp;<span ng-if="!$last">|</span>
    </span>
  </div>
</div> 

<script>
  angular.module('myApp',[])
  .controller('myController',function(){
    var vm =this;
    vm.menuItems=[];
    activate();
    function activate(){
     vm.menuItems = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split('');
    } …

构建一个简单的离子应用程序,连接到我也建立的API.我将一些数据传递到视图,所有数据都出现在图像的src属性中.如果我在控制器中记录了控制器中的数据,那么src就在那里,但它没有出现在视图中 - 它来自0,如:

<img ng-src="0" src="0">

我在我的控制器中传递它,如:

.controller('VenuesController', ['$state','$scope','$http','Venue', function($state,$scope,$http,Venue){
    $scope.venues = Venue.query();
    $scope.showVenue = function(id){
        $state.go('venues/:id',{id:id});
    };
}])

并在视图模板本身:

<ion-view view-title="Venues">
    <div class="list">
        <a ng-repeat="venue in venues" ng-click="showVenue({{venue.id}})" class="item item-thumbnail-left">
          <img ng-src="{{ venue.image-small }}">
          <h2>{{ venue.name }}</h2>
          <p>{{ venue.description }}</p>
        </a>
    </div>
</ion-view>

图像路径是一个完整的外部链接http://lorempixel.com/100/100/?51467,不确定我是否在这里遗漏了什么？

我是一个完全有角度的菜鸟，并试图在其中创建一个简单的测试应用程序。我想部分读出一些用户数据。用户数据位于我的事件控制器中。通过路由控制器导航到 #/new 后，我将事件控制器分配给 new.html 部分中的表单。

当我尝试循环访问我的部分中的用户时出现的错误是“错误：ngRepeat：iexp无效表达式”。我不知道如何通过这些用户进行 ng-repeat。

有什么想法吗？

我的index.html：

    <div class="container"  style="width: 500px; margin: 0 auto;">
        <ul class="nav nav-pills" ng-controller="NavigationController as navigationCtrl">
            <li ng-class="{active: navigationCtrl.isActive(1)}">
                <a href="#/">Home</a>
            </li>
            <li ng-class="{active: navigationCtrl.isActive(2)}">
                <a href="#/new">Nieuw</a>
            </li>
            <li ng-class="{active: navigationCtrl.isActive(3)}">
                <a href="#/another">Nog een</a>
            </li>
        </ul>
        <div ng-view></div>
    </div>

我的 new.html 部分

<form action="" ng-controller="EventController as event">
    <div ng-repeat="users as user">
        <label>Name</label>
        <input type="text" class="form-control" name="name" ng-model="user.name">
        <br>
        <label>Emailaddress</label>
        <input type="email" class="form-control" name="email" ng-model="user.email">

        <br>
        <input class="btn btn-default" type="submit" ng-click="event.addEvent($event)" value="Klik">
    </div>
</form>

最后：我的角度代码 …

我正在显示一个包含 JSON 的数组，并直接用 HTML 显示它，在这里你可以找到elem.fc + elem.cpc. 它将 NaN 作为输出。

这是我的 HTML：

<tr ng-show="table.table1loaded" ng-repeat="elem in filteredcampaignslist" ng-init="initializepopover()">
<td ng-show="app.ostype=='iOS'"><div class="text-center">{{elem.fc+elem.cpc}}</div></td>
</tr>

我在 angular (1.5.8) 中按类型（数字）过滤列表时遇到了一些麻烦

我的 ng 重复过滤器如下：

ng-repeat="activity in guild.history_updates | filter : {
    action_type: filters.action_type,
    user_id: filters.user,
}"

还有我的过滤器

<md-input-container class="md-block">
    <label>Type</label>
    <md-select ng-model="filters.action_type">
        <md-option>
            All
        </md-option>
        <md-option ng-repeat="action_type in guildActivityCtrl.action_types"
            ng-value="action_type.type">
            {{action_type.name}} ({{ action_type.type }})
        </md-option>
    </md-select>
</md-input-container>

当我在 action_type 1 上过滤时，我也得到了动作类型 10

但是当我将过滤器改为 10 时，我得到了正确的结果

其他所有动作类型也都过滤良好（例如 action_type 3）

如何仅在输入大于 3（或 N）个字符时应用过滤器来获得 ng-repeat 的结果？

我尝试了以下（过滤器： input.lenght > 3）：

<input type="text" ng-model="input" placeholder="Search">

<li ng-repeat="detail in details | filter: input.lenght > 3">
  {{ detail.name }}
</li>

但它不起作用。我怎样才能做我想做的事？问候朋友。

解决方案：

<input type="text" ng-model="input" ng-minlength="3" placeholder="Search">

我试图通过followPerson()函数传递跟随者.如果我跟随Perers(123),这可以正常工作.但是,当我跟随角色({{follower.follower}})时,它不会发射.

{{follower.follower}}绝对有效,因为它以粗体显示.

<div ng-repeat="follower in followers.followers">
    <b>{{follower.follower}}</b>
    <a ng-click="followPerson({{follower.follower}})">Follow</a> 
</div>