ng显示“;调用方法“;不起作用
ng-show "call method" doesnt work
我是AngularJs的新手,通过w3schools教程,我创建了自己的示例,其中ng-show在ng-click事件后调用方法来删除元素。
当我点击按钮时,它调用HidePerson()
方法。此外,它多次调用 ShowPerson()
方法,似乎可以找到,但无论何时返回true
或 false
元素都是可见的。
这是我的密码。
var personCtrl = angular.module('person', []);
personCtrl.controller('personCtrl', function ($scope, $http) {
$scope.persons = [];
$scope.personIgnoreList = [];
$scope.GetPersons = function () {
$http.get('http://www.w3schools.com/website/Customers_JSON.php')
.success(function (data, obj1, obj2, obj3) {
$scope.persons = data;
})
.error(function (data, obj1, obj2, obj3) {
$scope.persons = "Ops... smth went wrong...";
})
};
$scope.ShowPerson = function (person) {
$($scope.personIgnoreList).each(function (i, p) {
if (p == person) {
return false;
}
});
return true;
}
$scope.HidePerson = function (person) {
$scope.personIgnoreList.push(person);
}
});
<div ng-app="person" class="container" ng-controller="personCtrl" ng-init="GetPersons()">
<div class="row">
<div class="col-md-3" ng-repeat="person in persons">
<div ng-show="ShowPerson(person)">
<button class="btn btn-lg btn-info"
ng-click="HidePerson(person)">
{{person.Name}} from {{person.City}} - {{person.Country}}
</button>
</div>
</div>
</div>
</div>
使用此代码
$($scope.personIgnoreList).each(function (i, p) {
if (p == person) {
return false;
}
});
return true;
您总是返回true
,因为从$.each
返回与从函数返回不同(它只会打断循环)。
正确的方法是使用这样的东西:
$scope.ShowPerson = function (person) {
return !$scope.personIgnoreList.some(function(p) {
return p === person;
});
}
演示:http://plnkr.co/edit/yGy8x2k25Dkpu6hLj4eu?p=preview
我不会在angularJS中使用jQuery,在你的情况下是无用的,你可以像这样更改forEach:
$scope.ShowPerson = function (person) {
var show = true;
angular.forEach($scope.personIgnoreList, function (p, i) {
if (p == person) {
show= false;
}
});
return show;
}
Array
具有方法some
和every
,它们允许您进行此类测试。
$scope.ShowPerson = function (person) {
return $scope.personIgnoreList.every(function(p) {
return p != person;
});
};
对于personIgnoreList
中的每个人,some
测试其是否不等于person
。如果是,则中断并返回false
。
注意:every
在IE 8中不可用。
相关文章:
- electronic BrowserWindow的最小高度和宽度在hide()show()方法之后不起作用
- Meteor-添加用户自定义字段的方法不起作用
- JQuery示例不起作用-“;对象没有't支持属性或方法'按钮'&”;
- 对象文字方法上的Javascript绑定不起作用
- jQuery css可见性在load方法中不起作用
- 为什么jQuery悬停方法在这种情况下不起作用
- ng显示“;调用方法“;不起作用
- 在 JQUERY 中创建 HTML 后,Jquery 方法不起作用
- 下拉 jquery 方法发布表单不起作用
- 为什么push方法没有'在这种情况下不起作用:[].推
- dojo/request PUT方法dosn'不起作用
- Jquery事件绑定获胜'当作为方法调用时不起作用,但当直接在控制台中调用时会起作用
- html视频javascript播放方法在移动Safari中不起作用
- 为什么这个扩展方法不起作用
- 我需要一种自动调整iframe大小的方法,无论我查到什么,它都不起作用
- jQuery切换方法的动画不起作用
- Angularjs 跨源资源共享 (CORS) 发布或放置方法在 IE8 和 IE9 中不起作用
- 在node_redis上实现findBy方法,但它没有'不起作用
- Splice()方法不起作用
- 使用replace方法替换innerHTML以及在Javascript中不起作用的正则表达式