0

angular の背後にあるアイデアを把握しようとしていますが、スコープ外 (アプリ?) からデータにアクセスするという最初の障害に遭遇しました。

これは私がやろうとしていることの非常に簡単な例です:

HTML:

<div class=logo>
    <a href='/refresh'>Refresh</a>
</div>
<div ng-app ng-controller="threadslist">
<div class='thread_list_header'>
    <table class='thread_list_table'>
    <tr class='table_header'>
        <!--1--><td class='table_c1'></td>
        <!--2--><td class='table_c2'>{{name}}</td>
        <!--3--><td class='table_c3'>Cliq</td>
        <!--4--><td class='table_c4'>Last Poster</td>
        <!--5--><td class='table_c5'><a class="clickme">Refresh</a></td>
    </tr></table>
</div>
<table class='thread_list_table' >
    <tr class="thread_list_row" ng-repeat="user in users">
                <!--1--><td class='table_options table_c1'></td>
        <!--2--><td class='table_subject table_c2' title="">{{user.subject}}</td>
                <!--3--><td class='table_cliq table_c3'></td>
                <!--4--><td class='table_last table_c4'><span class="thread_username"><a href=#>{{user.username}}</a></span></td>
                <!--5--><td class='table_reply table_c5'><abbr class="thread_timestamp timeago" title=""></abbr></td>
    </tr>
    </table>
</div>

JS:

function threadslist($scope, $http) {
  $scope.name = 'Ricky';

  // Initialising the variable.
  $scope.users = [];
     $http({
    url: '/cliqforum/ajax/ang_thread',
    method: "POST",
  }).success(function (data) {
      console.log(data);
    $scope.users = data;
  });
  // Getting the list of users through ajax call.
  $('.table_header').on('click', '.clickme', function(){
        $http.get('/cliqforum/ajax/ang_thread').success(function(data){

            $scope.users = data;
        });   
  });
}

これは私が理解できない部分です。私のロゴは、現在の「ユーザー」データにあるフィルターをクリアすることになっています。ただし、それは範囲外にあります（範囲をページ全体に拡張するべきではないと思いますか？）

私は何かを読んだことscope.$spplyがありますが、私が何をすべきかを完全に理解することはできません:

 $('.logo').on('click', 'a', function() {
         scope.$apply(function () {
            $scope.users = data;
        });
    });

このようにする必要はまったくありません...正しいことをしたいだけです!

ありがとう！

4

2 に答える 2

3

スコープをページ全体に拡張するべきではないと思いますか？

なぜだめですか？それは間違いなくそれを行う方法です。ロゴをスコープに含めるだけで、アプリケーションからロゴにアクセスしng-click、クリック ハンドラーを追加するために使用できます。

実際、アプリケーション内で jQuery クリック ハンドラーを使用することは避けてください。JavaScript を次のように変換できます。

$scope.tableHeaderClick = function() {
    $http.get('/cliqforum/ajax/ang_thread').success(function(data){
        $scope.users = data;
    });   
});

次に、HTML を次のように更新します。

<tr class='table_header' ng-click="tableHeaderClick()">
于 2013-05-21T14:22:07.653 に答える
1

コントローラーにDOM要素を含めることは、角度のあるアンチパターンです。クリックイベントに応答するために ng-click ディレクティブを使用したい

このplnkrを参照してください：http://plnkr.co/edit/KRyvifRYm5SMpbVvWNfc?p= preview

于 2013-05-21T14:22:16.077 に答える