2016-03-23 146 views
1

我有一个MySQL数据库和表格。我使用Node JS从中获取数据。我的HTML代码包含输入搜索和包含搜索结果数据的表格。我使用AngularJS进行搜索。AngularJS搜索不起作用

问题是搜索不起作用。我有整个表格而不是一些结果。的HTML代码

部分:

<div class="search"> 
    <form action="" method="post" class="searchform" > 
    <input type="search" name="" placeholder="Поиск" class="inputsearchform" ng-model="search"/> 
    <input type="submit" name="" value="" class="submitsearchform" /> 
    </form> 
</div> 
<div class="songlist" ng-app='test_table' ng-controller='main_control'> 
    <table id="songlistTableR"> 
    <tr><th>Name</th><th>Link</th></tr>  
    <tr ng-repeat="data in loaded | filter:search"> 
     <td><i class="fa fa-plus"></i>{{data.song_name}}</td> 
     <td><a href="{{data.link}}" target='_blank'>Youtube</a></td>  
    </tr> 
    </table>  
</div> 

JS脚本:

var app = angular.module('test_table', []); 
app.controller('main_control',function($scope, $http){ 
    load(); 
    function load(){ 
     $http.get("http://localhost:7001/load").success(function(data){ 
      $scope.loaded=data; 
     }); 
    }  
}); 

回答

2

你的所有角度的html代码需要被嵌套在NG-应用的属性,所以你<div class="search">从未被角解析,包括你的ng模型定义。你应该编辑你的代码,如下所示:

<div class="songlist" ng-app='test_table' ng-controller='main_control'> 
    <div class="search"> 
    <form action="" method="post" class="searchform" > 
     <input type="search" name="" placeholder="Поиск" class="inputsearchform" ng-model="search"/> 
     <input type="submit" name="" value="" class="submitsearchform" /> 
    </form> 
    </div> 
    <table id="songlistTableR"> 
    <tr><th>Name</th><th>Link</th></tr>  
    <tr ng-repeat="data in loaded | filter:search"> 
     <td><i class="fa fa-plus"></i>{{data.song_name}}</td> 
     <td><a href="{{data.link}}" target='_blank'>Youtube</a></td>  
    </tr> 
    </table>  
</div> 
+0

肯定对我来说太愚蠢了。谢谢! –

+0

当然我会接受,但我只能在2分钟内完成。你能帮忙,例如如何只在song_name列搜索? –

+1

@LevS类似这样的'ng-repeat =“数据在加载|过滤:{歌名:搜索}”' –