我對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