我对angularjs相当新颖,所以我不确定我想要做的是正确的方法。基本上我想在我的页面中显示一个嵌套的对象和一个过滤器,这样用户可以很容易地在输入上键入关键字并且内容被过滤,只显示过滤器发现的记录对嵌套对象使用angularjs过滤器
但是我请注意,过滤器会获取整个父对象,而且我期望只显示记录,因此使用以下代码,如果我搜索日本,它将显示悉尼,墨尔本和洛杉矶。
的Javascript
<script type="text/javascript">
var demoApp = angular.module('demoApp',['ngSanitize']);
demoApp.controller('simpleC',['$scope', function ($scope){
$scope.info = [
{name: 'Documents',links: [
{linkname:'title1',linknamesublink:[
{namesublink:'document 1', description: 'Sydney'},
{namesublink:'document 2', description: 'Tokyo <b>Japan</b>'}
]},
{linkname:'title2',linknamesublink:[
{namesublink:'document 3', description: 'Melbourne'},
{namesublink:'document 4', description: 'Los Angeles'}
]}
]},
{name: 'Video',links: [
{linkname:'title1',linknamesublink:[
{namesublink:'video 1', description: 'California'},
{namesublink:'video 2', description: 'San Francisco <b> USA</b>'}
]},
{linkname:'title2',linknamesublink:[
{namesublink:'video 3', description: 'South America'},
{namesublink:'video 4', description: 'Northern <b>Europe</b>'}
]},
{linkname:'title3',linknamesublink:[
{namesublink:'video name 5', description: 'Africa'},
{namesublink:'video name 6', description: 'Bangkok <b>Thailand</b>'}
]}
]},
];
}]);
</script>
HTML:
<div class="container" ng-app="demoApp">
<br /><input type="text" class="form-control" ng-model="search" >
<div ng-controller="simpleC">
<div ng-repeat="i in info | filter:search" >
{{i.name}} :
<div ng-repeat="link in i.links">
{{link.linkname}}
<div ng-repeat="sublink in link.linknamesublink">
{{sublink.namesublink}}: <!--{{sublink.description}}-->
<span ng-bind-html="sublink.description"></span>
</div>
</div>
</div>
</div>
</div>
您是否想要实现类似自动完成的功能?你可以考虑使用这个链接中解释的typehahaed指令:http://angular-ui.github.io/bootstrap/ – 2014-09-01 11:52:41
对于那个投了这个问题的人(如果再回来阅读它),你能否提供投下的原因,如果是复制问题或太简单的问题,请提供解决方案。 – Manza 2014-09-03 06:28:51