标签: angularjs-orderby

Angularjs - 在控制器范围内使用orderby过滤器

我有一个对象数组,即过滤和分页,现在我想按不同的对象属性排序列表项.

我尝试orderBy过滤器如下:

<th><a href='' ng-click="reverse = sortParam == 'title' && !reverse; sortParam = 'title'">Title</a></th>

<tr ng-repeat="item in pagedItems|filter:filterParam|orderBy:sortParam:reverse">
    <td>{{ item.title }}</td>
</tr>
Run Code Online (Sandbox Code Playgroud)

这似乎工作正常,单击Title链接,按字母顺序排序或按字母顺序反转,具体取决于当前状态.

但这里的问题是只有pagedItems正在排序,这是有意义的,因为我们正在应用orderBy过滤器pagedItems.我想要实现的是在应用过滤器时订购整个项目集(不仅仅是当前分页的项目).

为了实现这一点,我想我会在控制器范围内使用一种方法.所以我把上面改为:

/** In the Template */

<th><a href='' ng-click="sortItems('title')">Title</a></th>

<tr ng-repeat="item in pagedItems|filter:filterParam">
    <td>{{ item.title }}</td>
</tr>


/** In the Controller */

$scope.sortItems = function(value) {
    $scope.filtered = $filter('orderBy')($scope.filtered, value);
};

$scope.$watch('currentPage + numPerPage + filtered', function() {
    $scope.pagedItems = getPagedItems($scope, 'filtered');
});
Run Code Online (Sandbox Code Playgroud)

sortItems方法工作并更改顺序,但视图中的项目未更新,因为 …

pagination watch angularjs angular-ui angularjs-orderby

8
推荐指数
1
解决办法
2万
查看次数

OrderBy Date值,它们只是Angular JS中的字符串

我试图按日期订购一些数据,虽然日期只是字符串,格式为dd-mm-yyyy.

我做了一个过滤器,它转换了普通的数字字符串(在美国的日期格式,我想要英国日期格式),例如01272012到27-01-2014,但当我尝试订购它时,它仍然只看到它们数字字符串,所以01-01-1990将在02-01-2014之前出现.

有关如何在过滤器中执行此操作的任何建议?

谢谢!

更新

我发现如果日期格式为yyyy-mm-dd,日期会自动排序.然后我用来orderBy:['date']订购数据,只在显示数据时使用我的原始过滤器.

我最终不得不撤消我的数据,显示最近的日期.为了达到这个目的,我-在我的订单中添加了一个声明:orderBy:['-date'].

javascript date angularjs angularjs-orderby

8
推荐指数
1
解决办法
1万
查看次数

更新到Angular 1.5.3时出现错误'orderBy'

我在项目中更新了Angular,从1.4.9更新到1.5.3.在其中一个页面上我收到此错误消息:

'Error: orderBy:notarray Value is not array-like', 'Expected array but received: 0'
Run Code Online (Sandbox Code Playgroud)

这是模板:

<tr ng-repeat="targeting in vm.TargetingsAudience track by $index  | orderBy:orderByName">
                    <td>
                        {{targeting.Name}}
                    </td>
                    <td class="au_content_descr">
                        <p ng-repeat="val in targeting.Values track by $index  | orderBy:orderByName" class="targeting-value">{{val}}</p>
                    </td>
                    <td class="au_ico_2">
                        <a class="au_del au_fast_ico" ng-click="vm.removeTargeting(targeting)"><i class="glyphicon glyphicon-remove"></i></a>
                        <a class="au_edit au_fast_ico" ng-click="vm.editTargeting(targeting)"><i class="glyphicon glyphicon-pencil"></i></a>
                    </td>
                </tr>
Run Code Online (Sandbox Code Playgroud)

vm.TargetingsAudience - 是一个对象数组:

[{Name: "???", TargetingCategory: "Audience", TypeId:"Location", Values: [0: "??????", 1: "??????", 2: "?????????? ???????"]}]
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-orderby

8
推荐指数
2
解决办法
4511
查看次数

为什么优势或过滤和订单?

似乎AngularJS非常强调在您的视图中使用过滤器和其他ng指令来过滤和排序数据,而不是在模型中手动执行.有什么理由,即它更快,缓存,还是什么?

我想显示一个列表,例如,但我也想访问排序列表以用于与视图无关的其他目的.如果列表直接在模型中排序很容易,所以我试图理解这样做是否有缺点.

谢谢!

angularjs angularjs-orderby

7
推荐指数
1
解决办法
3751
查看次数

angularjs ngRepeat orderBy当属性键有空格时

我得到一些JSON格式的数据,其中一些键中有空格:

[
    {
        "PlainKey": "SomeValue",
        "Spaced Key": "SomeValue"
    },
    {
        "PlainKey": "SomeValue2",
        "Spaced Key": "SomeValue2"
    }
]
Run Code Online (Sandbox Code Playgroud)

这发生在某个时刻:

$http.get('https://dl.dropboxusercontent.com/u/80497/htmlTesting/properties/credits.properties' + '?callback=JSON_CALLBACK').then(function (data) {
            $scope.credits = data.data;
        }, function (error) {
            $scope.errorOccured = true;
            console.log("Error:");
            console.log(error);
        });
Run Code Online (Sandbox Code Playgroud)

然后ng-repeat用于显示它,并订购:

<select ng-model="corder">
  <option value="PlainKey">Plain Key</option>
  <option value="Spaced Key">Spaced Key</option>
</select>

<li ng-repeat="credit in credits | orderBy:corder" >
.....
</li>
Run Code Online (Sandbox Code Playgroud)

这不起作用(我得到一个例外)(PlainKey因为没有空格,所以工作).

我也尝试将值放入':

<select ng-model="corder">
  <option value="'PlainKey'">Plain Key</option>
  <option value="'Spaced Key'">Spaced Key</option>
</select>
Run Code Online (Sandbox Code Playgroud)

这似乎改变了顺序,但不正确.

我错过了什么?

谢谢!

angularjs angularjs-ng-repeat angularjs-orderby

7
推荐指数
2
解决办法
3876
查看次数

Angular orderBy对象可能吗?

我有一个表示日历日期的JSON对象.这些是通过CMS添加的,我希望能够根据日期过滤它们.我的架构设置使得这比我想象的更难.是否可以在此JSON对象中订购日期值或是否有过滤器解决方法?

这是我的JSON对象:

{
"_id" : ObjectId("53f252537d343a9ad862866c"),
"year" : {
    "December" : [],
    "November" : [],
    "October" : [],
    "September" : [],
    "August" : [],
    "July" : [ 
        {
            "day" : "21",
            "title" : "Event Title",
            "summary" : "Event Summary",
            "description" : "oEvent Description",
            "_id" : ObjectId("53f252537d343a9ad862866d")
        }
    ],
    "June" : [],
    "May" : [],
    "April" : [],
    "March" : [],
    "February" : [],
    "January" : []
},
"__v" : 0
}
Run Code Online (Sandbox Code Playgroud)

这是我的视图,它已经使用自定义过滤器按月过滤.orderBy没有运行,但我把它留作占位符来显示我想要设置功能的位置.

<div class="calDynamic" data-ng-repeat="n in [] | range:100">
<div …
Run Code Online (Sandbox Code Playgroud)

json angularjs angularjs-orderby angular-filters

7
推荐指数
1
解决办法
2万
查看次数

编辑orderby-property时,AngularJS orderby不起作用

我在我的范围内有一个对象列表,并希望迭代它们,以有序的属性方式显示它们的一些属性并更改它们.

ng-repeat用于显示绑定到列表中每个对象的文本框,以及使用"position"作为参数的orderby过滤器.

再次,位置也是可编辑的!

现在我们改变某个对象的位置一次(角度按预期重新排列列表),然后改变两次.Angular不会重新排序列表.

任何人都可以解释如何修复这种仅重新排序的情况以及这种行为的原因是什么?

这是小提琴:JSFiddle

HTML

<div ng-controller="MyCtrl">
    <p>List of activities:</p>
    <div ng-repeat="activity in model.activities | orderBy: 'position'">
        <textarea type="text" ng-model="activity.name">

        </textarea>
        {{activity.name}}
        <input type="text" ng-model="activity.position">
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

JS

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

function MyCtrl($scope) {
    $scope.model = { 
        activities: [
            {name: "activity 1", position: 1}, 
            {name: "activity 2", position: 2}, 
            {name: "activity 3", position: 3}, 
            {name: "activity 4", position: 4}, 
            {name: "activity 5", position: 5}
        ] 
    };
}
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-orderby angularjs-model

7
推荐指数
1
解决办法
779
查看次数

ng-repeat orderBy保持固定的最高值

看到这里的小提琴http://jsfiddle.net/prantikv/gcz4gwgw/1/

我想在列表顶部获得一个i项目,其余按字母顺序排列:

<div ng-controller="MyCtrl">
 <ul>
  <li ng-repeat="value in name | orderBy:'name'">{{value.name}} </li>   
   </ul>    

  </div>
Run Code Online (Sandbox Code Playgroud)

在我的控制器中,我有以下内容

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

function MyCtrl($scope) {
    $scope.name=[
{name:'zani',country:'Norway'},
{name:'aege',country:'Sweden'},
{name:'Kai',country:'Denmark'}]


}
Run Code Online (Sandbox Code Playgroud)

我想要的是首先出现名字"kai",然后按字母顺序排列其余部分.

================编辑===============

现在我已经玩了并获得了以下内容

在我看来:

<div ng-controller="MyCtrl">
 <ul>
  <li ng-repeat="value in name | orderBy:myValueFunction ">{{value.name}} </li>   
   </ul>    

  </div>
Run Code Online (Sandbox Code Playgroud)

在我的控制器中:

 $scope.myValueFunction = function(value) {
    if(value.name == "kai"){

        return value.name;
    }else{
        //what todo here so the rest of the list is sorted alphabetically
    }
}        
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angularjs-ng-repeat angularjs-orderby

7
推荐指数
2
解决办法
3752
查看次数

AngularJS ng-repeat orderBy错误地命令数字

当文本中有数字时,我遇到使用ng-repeat orderBy的问题.

样本数据:

[
   {booth: 'p1'},
   {booth: 'p2'},
   {booth: 'p3'},
   {booth: 'p4/5'},
   {booth: 'p6/7'},
   {booth: 'p8'},
   {booth: 'p9'},
   {booth: 'p10'},
   {booth: 'p11'},
   {booth: 'p12'},
   {booth: 'p13'}
]
Run Code Online (Sandbox Code Playgroud)

当使用ng-repeat和orderBy时:'booth'列出如下:p1,p10,p11,p13,p2,ect

我理解这是预期的行为,但有谁知道我怎么能按照我期望的顺序列出展位?

这将是:p1,p2,p3,p4/5等

我也试过看看问题是因为数字不是整数而是返回了同样的问题.

预先感谢您的任何帮助.

sorting angularjs angularjs-ng-repeat angularjs-orderby angularjs-filter

6
推荐指数
1
解决办法
6109
查看次数

对数组数组进行ng-repeat,orderBy为子数组索引

假设我有这个对象:

var rows = [
    [1, 2, 3, 4],
    [11, 222, 3333, 4444]
];
Run Code Online (Sandbox Code Playgroud)

鉴于此,以及此模板:

<tr ng-repeat="row in rows | orderBy ????">
    <td ng-repeat="cell in row">{{ cell }}</td>
</tr>
Run Code Online (Sandbox Code Playgroud)

...如何ng-repeat通过每行的第二个"列"(1给定row元素的索引处的值)来命令?

我是否正确Angular不支持这种情况 - 无需编写自定义排序功能?(我只是原型设计,所以使用ng-init定义范围变量而不是创建控制器.)

angularjs angularjs-orderby

6
推荐指数
1
解决办法
1592
查看次数