我想實作一個搜索內容,然后自動匹配相關內容的標題 和內容資訊,
<body ng-controller="ctr" >
<input type="text" class="form-control" ng-model="Newsname.name">
<ul class="list-group">
<li ng-repeat="item in newsList">{{item.cn}}</li>
</ul>
<ul class="list-unstyled list-inline" >
<li ng-repeat="item in newsData[activeitem]|filter:Newsname.name">
<div class="media" >
<div class="media-body">
{{item.title}}
</div>
<div class="media-right" >
<img ng-src="https://bbs.csdn.net/topics/{{item.picInfo[0].url}}" style="width: 100px">
</div>
</div>
</li>
</ul>
</body>
</html>
<script>
angular.module("app",["ngSanitize"])
.controller("ctr",["$scope","$http","$rootScope",function ($scope,$http,$rootScope){
$rootScope.newsList=[
{en:"auto",cn:"汽車",state:true},
{en:"dy",cn:"推薦",state:true},
{en:"ent",cn:"娛樂",state:true},
{en:"home",cn:"家居",state:true},
{en:"sports",cn:"體育",state:true},
{en:"tech",cn:"科教",state:true},
{en:"toutiao",cn:"新聞",state:true},
{en:"war",cn:"軍事",state:true},
{en:"money",cn:"財經",state:false}
];
$rootScope.activeitem="toutiao";
$scope.Newsname={"name":""};
var url="yaowen.json";
$scope.getNews=function () {
$http({
methon:"GET",
url:url
}).then(function (res) {
$rootScope.newsData=https://bbs.csdn.net/topics/res.data.data;
}),
function (err) {
}
};
$scope.$watch("Newsname",function (n,o) {
for(var index in $rootScope.newsData ){
for(var i=0;i<$rootScope.newsData[index].length;i++){
if(n.name==$rootScope.newsData[index][i].title){
$scope.Newscn=$rootScope.newsData[index][i].category;
}
}
console.log( $rootScope.newsData[index][i].category)
}
});
$scope.getNews();
}])
</script>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/57681.html
標籤:JavaScript
