角度范围长度不起作用

时间:2015-11-10 19:56:29

标签: javascript angularjs

我通过ng-repeat将范围转储到表中。此数据由3个不同的东西过滤,2个选择和一个文本框。所有这一切都很好,但我需要回应表中有多少结果。使用{{ sounds.length }}显然不起作用,因为这是过滤之前的计数,过滤对此没有影响。所以我添加了一个变量sound in soundsres = (sounds | filter: filters here),但在控制台中没有错误地执行{{ soundsres.length }}回声。

以下是一整套代码。我在这里想念的是什么所有的迹象(我甚至在这里检查了文档和几个较旧的线程)表明这应该是有效的。提前谢谢。

代码:

<input type="text" ng-model="gearsearch">
<select ng-model="stypesearch"><option>1</option></select>
<select ng-model="stypesearch2"><option>2</option></select>

<span>{{ soundsres.length }}</span>

<table ng-controller="GearController">
  <tr ng-repeat="sound in soundsres = (sounds | filter: gearsearch | filter: stypesearch | filter: stypesearch2)">
    <td>{{ sound.id }}</td>
    <td>{{ sound.model }}</td>
    <td>{{ sound.make }}</td>
    <td>{{ sound.type }}</td>
    <td>{{ sound.class }}</td>
    <td>{{ sound.status }}</td>
    <td>{{ sound.cost | currency }}</td>   
  </tr>
</table>

1 个答案:

答案 0 :(得分:1)

您可以使用controllerAs语法并将soundRes添加到MainController,也可以使用$parent.soundRes将过滤结果添加到父作用域。我认为controllerAs方法更清晰,但两者都有效。

请查看下面的演示或此libnl-3's API

(对不起,我在演示中的数据模型不佳,但我没有更好的数据模型。但是可以证明长度已正确更新。)

&#13;
&#13;
angular.module('demoApp', [])
	.controller('ViewController', function() {
		var vm = this,
        sameDate = new Date();
    
    sameDate.setMinutes(sameDate.getMinutes() - 5);
    var dateLimit = new Date(sameDate);
    
    var dates = [
        {
            name: 'test1',
        	date: new Date(sameDate)
        },
        {
            name: 'test2',
        	date: new Date(sameDate)
        },
        {
            name: 'test3',
        	date: new Date()
        }];
        
    vm.dates = dates;
	})
	.controller('MainController', MainController);

function MainController() {
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="demoApp" ng-controller="MainController as mainCtrl">
    <input ng-model="mainCtrl.searchText"/>
    <select ng-model="mainCtrl.stypesearch"><option>1</option></select>
    <select ng-model="mainCtrl.stypesearch2"><option>2</option></select>

    <!--results: {{mainCtrl.filterRes.length}}-->
    results: {{filterRes.length}}
    <ul ng-controller="ViewController as viewCtrl">
        <li ng-repeat="date in $parent.filterRes = ( viewCtrl.dates | filter:mainCtrl.searchText | filter: mainCtrl.stypesearch | filter: mainCtrl.stypesearch2 )">{{date}}</li>
    </ul>
</div>
&#13;
&#13;
&#13;