1

すべて AngularJS を使用して、検索クエリをリアルタイムで更新する $watch を入力しました。私の問題は、モデルの初期値を空として定義しても、検索がトリガーされ、デフォルトで結果が表示されることです。

だから私の質問は、デフォルトで空の値を持つことを目指して、ユーザーが入力に何かを入力したときにのみ実際に検索をトリガーする方法はありますか? ng-click で $watch をトリガーする関数を作成しようとしましたが、これまでのところ、ng-init と同じようにうまくいきません。ng-repeat の条件を作成して、名前が != '' の場合にのみ実行することもできますか?

考えられる回避策について何か考えはありますか?

ここに私のJSがあります：

function Ctrl($scope, $http) {
var get_results = function(name) {
        $http.get('http://api.discogs.com/database/search?type=artist&q='+ name +'&page=1&per_page=30').
    success(function(data3) {
        $scope.results = data3.results;
    });
}
$scope.$watch('name', get_results, true);
$scope.name = '';

}

私のHTML：

<div ng-controller="Ctrl">
  <h1>Search Artist</h1>
  <input type="text" ng-model="name"/>
  <ul>
    <li ng-repeat="result in results">{{result.title}}</li>
  </ul>
</div>

そして、動作中のJSFiddle。

どんな助けでも大歓迎です！ありがとう、エリック

4

1 に答える 1

1

関数内の if 条件を使用get_resultsして、名前が空かどうかをチェックし、空でない文字列の場合にリクエストを実行します。

var get_results = function(name) {
  if (name) {
    $http.get('http://api.discogs.com/database/search?type=artist&q='+ name +'&page=1&per_page=30').
       success(function(data3) {
         $scope.results = data3.results;
    });
  }
}

JSFiddle

于 2014-03-13T00:53:12.703 に答える