如何根据AngularJS中的范围过滤数据?
我将以下内容简化,以证明我的问题: html:如何根据AngularJS中的范围过滤数据?,angularjs,angularjs-directive,angular-filters,Angularjs,Angularjs Directive,Angular Filters,我将以下内容简化,以证明我的问题: html: 指令: app.controller('MainCtrl', function($scope) { $scope.questions = [ {qid:'1', show: true, text:'what is?'}, {qid:'2', show: false, text:'who is?'}, {qid:'3', show: true, text:'where is?'} ]; }); app.direct
指令:
app.controller('MainCtrl', function($scope) {
$scope.questions = [
{qid:'1', show: true, text:'what is?'},
{qid:'2', show: false, text:'who is?'},
{qid:'3', show: true, text:'where is?'}
];
});
app.directive('myDirective', function() {
return {
link: function(scope){
scope.getShow = function(){
// some logic to determine show
// for simlicity , always return true so all questiosn show
return true;
};
},
restrict: "E",
scope: {
question: "="
},
template: '<h1>{{question.text}}</h1>'
};
});
app.controller('MainCtrl',函数($scope){
$scope.questions=[
{qid:'1',show:true,text:'what is?',
{qid:'2',show:false,text:'who is?',
{qid:'3',show:true,text:'where is?'
];
});
app.directive('myDirective',function(){
返回{
链接:功能(范围){
scope.getShow=函数(){
//决定演出的一些逻辑
//对于simlicity,始终返回true,以便显示所有问题
返回true;
};
},
限制:“E”,
范围:{
问题:“=”
},
模板:“{question.text}”
};
});
当前,过滤器基于来自原始数据模型的“show”值工作。但是我试图从原始数据中清除它,并使它基于在问题范围级别定义的getShow()
逻辑工作
通常,我无法找到一种基于作用域上的字段或函数而不是数据模型进行过滤的方法,也找不到一个示例来说明如何进行过滤 在
ng repeat
中,只需将ng show
设置为等于getShow()
函数,并传递迭代问题
获取getShow()
以检查show是true还是false,并返回该值
app.js
:
var app = angular.module('angularjs-starter', []);
app.controller('MainCtrl', function($scope) {
$scope.questions = [
{qid:'1', show: true, text:'what is?'},
{qid:'2', show: false, text:'who is?'},
{qid:'3', show: true, text:'where is?'}
];
});
app.directive('myDirective', function() {
return {
link: function(scope){
scope.getShow = function(question){
// some logic to determine show
// for simlicity , always return true so all questiosn show
return question.show
};
},
restrict: "E",
scope: {
question: "="
},
template: '<h1>{{question.text}}</h1>'
};
});
当然,在
ng repeat
中,只需将ng show
设置为等于getShow()
函数,并传递迭代问题
获取getShow()
以检查show是true还是false,并返回该值
app.js
:
var app = angular.module('angularjs-starter', []);
app.controller('MainCtrl', function($scope) {
$scope.questions = [
{qid:'1', show: true, text:'what is?'},
{qid:'2', show: false, text:'who is?'},
{qid:'3', show: true, text:'where is?'}
];
});
app.directive('myDirective', function() {
return {
link: function(scope){
scope.getShow = function(question){
// some logic to determine show
// for simlicity , always return true so all questiosn show
return question.show
};
},
restrict: "E",
scope: {
question: "="
},
template: '<h1>{{question.text}}</h1>'
};
});
当然,请在问题中张贴相关代码。问题应该是独立的,并且只使用演示站点作为问题中实际内容的支持。确实不清楚您想要做什么。请在问题本身中发布相关代码。问题应该是自包含的,并且只使用演示站点作为问题中实际内容的支持。真的不清楚您想要做什么,非常简单。我可能把它复杂化了。谢谢,非常简单。我可能把它复杂化了。非常感谢。
<my-directive ng-repeat="question in questions" ng-show="getShow(question)" data-question="question">