在angular中,您可以编写类似的过滤器表达式
<input type="text" ng-model="query">
<table>
<tr ng-repeat="phone in phones | filter: query">
<td>{{phone.vendor}}</td>
<td>{{phone.model}}</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
它会更新表格,只显示与query您输入的文字相匹配的手机input.
如何[phone object]在变量(例如范围变量)中获取过滤器的相应结果数组,例如当前显示的s?
根据https://github.com/angular/angular.js/wiki/Understanding-Scopes,尝试数据绑定到附加到您的原语的问题是一个问题$scope:
范围继承通常很简单,你通常甚至不需要知道它正在发生......直到你尝试双向数据绑定(即表单元素,ng-模型)到一个原语(例如,数字,字符串, boolean)在子范围内从父范围定义.它不像大多数人期望的那样工作.
建议是
通过遵循始终具有'.'的"最佳实践",可以轻松避免与原语的这个问题.在您的ng模型中
现在,我有这个非常简单的设置违反了这些规则:
HTML:
<input type="text" ng-model="theText" />
<button ng-disabled="shouldDisable()">Button</button>
Run Code Online (Sandbox Code Playgroud)
JS:
function MyController($scope) {
$scope.theText = "";
$scope.shouldDisable = function () {
return $scope.theText.length >= 2;
};
}
Run Code Online (Sandbox Code Playgroud)
这真的很糟糕吗?当我开始尝试使用子范围时,这是否会以某种可怕的方式使我搞砸了?
我是否需要将其更改为类似的内容
function MyController($scope) {
$scope.theText = { value: "" };
$scope.shouldDisable = function () {
return $scope.theText.value.length >= 2;
};
}
Run Code Online (Sandbox Code Playgroud)
和
<input type="text" ng-model="theText.value" />
<button ng-disabled="shouldDisable()">Button</button>
Run Code Online (Sandbox Code Playgroud)
所以我遵循最佳做法?你可以给我什么样的具体例子,后者将使我免于前者出现的一些可怕后果?
我在我的项目中使用angularjs v1.2.9.我使用dir-pagination在我的网络应用程序中显示项目列表.一些过滤器也用于动态地对列表进行排序.有没有办法让我在控制器中获取动态排序列表?我尝试了这里给出的解决方案.但他们似乎并没有使用dir-pagination.
<tr dir-paginate="person in contacts|filter:searchText|filter:groups|orderBy:['name','email'] | itemsPerPage : 10"
Run Code Online (Sandbox Code Playgroud) 我在我的html文件中使用ng-repeat来显示过滤的项目:
<li ng-repeat="item in (filteredItems = (items | filter:query))">
{{ item.name }}
</a>
Run Code Online (Sandbox Code Playgroud)
在控制器中,我想根据他的一个属性获取项目的索引.
精度:我想在过滤列表中获取索引,而不是在整个列表中.
例如,这将是女巫名称的索引some_item_7.
var app = angular.module('myApp', []);
app.controller('MyCtrl', ['$scope',
function MyCtrl($scope) {
$scope.query = 'some';
$scope.items =
[
{ name: 'some_item_1' },
{ name: 'another_item_2' },
{ name: 'some_item_3' },
{ name: 'another_item_4' },
{ name: 'some_item_5' },
{ name: 'another_item_6' },
{ name: 'some_item_7' },
{ name: 'another_item_8' },
{ name: 'some_item_9' }
];
$scope.itemNext = function (item) { …Run Code Online (Sandbox Code Playgroud) angularjs ×4