1

ng-model属性が「search.name」に設定された入力があります

HTML

Search: 
<span id="searchName"> titles </span> | <span id="searchSpecies"> species </span>:

<input type="text" data-ng-model="search.name" />

リンクやボタンなどの別の要素がクリックされたときにこの属性を変更し、更新された属性でフィルターを機能させるにはどうすればよいですか? 現在、属性を更新しても、フィルターは更新されていないかのように動作します。

これは私が属性を更新する方法です：

脚本

$("#searchName").click(function() {
     $("input").attr("data-ng-model", "recipesearch.name");
});
$("#searchSpecies").click(function() {
         $("input").attr("data-ng-model", "recipesearch.species");
});

おそらくディレクティブを使用してこれを行うより良い方法はありますか?

4

3 に答える 3

3

私が問題を正しく理解していれば、入力ボックスに入力された内容に基づいてデータがフィルター処理されるフォームがあります。しかし、おそらく「一般的な検索値」のリストなど、検索を自動的に変更できる他のリンクもあります。

私がすることは、このFiddleで概説されています。

基本的に、リンクまたはボタンで ng-click を使用して、検索対象の値を更新することをお勧めします。

例：

マークアップ

 <a href="#" ng-click="changeSearchTo('Cat')">Cat</a>

コントローラ

 $scope.changeSearchTo = function (searchCriteria) {
     $scope.search = {
         name: searchCriteria
     };
 };

あなたの質問が理解できなかった場合は、お詫び申し上げます。

-サッド

于 2013-07-28T17:08:45.323 に答える
2

$setViewValueを見たいと思うかもしれません

「このメソッドは、DOM イベント ハンドラー内から呼び出す必要があります。たとえば、input または select ディレクティブが呼び出します。

内部ですべてのパーサーを呼び出し、結果の値が有効な場合、モデルを更新し、登録されているすべての変更リスナーを呼び出します。」

于 2013-07-28T06:21:44.297 に答える
1

$(document).ready()以下のようにコードをラップします

また、jQueryライブラリへのリンクを追加したことを確認してください

デモ

$(document).ready(function () {
    $("#searchName").click(function () {
        $("input").attr("data-ng-model", "recipesearch.name");
    });
    $("#searchSpecies").click(function () {
        $("input").attr("data-ng-model", "recipesearch.species");
    });
});
于 2013-07-28T04:21:47.750 に答える