2

OK..angular.jsを試しました。すばらしい。私が感銘を受けた。ビンディングなどを手に入れることができます。$ scopeの外部からデータにアクセスする必要がある場合はどうなりますか?それをインターセプトするデータと関数を送信するsignalRハブがあり、新しいアイテムを追加するか、既存のアイテムを変更する必要があるとします。それ、どうやったら出来るの?この例で、ハンドル$scope.twitterResultからアクセスする方法を教えてください。click

<script>
    angular.module('Twitter', ['ngResource'])

    function TwitterCtrl($scope, $resource){
        $scope.twitter = $resource('http://search.twitter.com/:action',
        {action: 'search.json', q: 'obama', callback:'JSON_CALLBACK'},
        {get:{method:'JSONP'}});
        $scope.doSearch = function(){
        $scope.twitterResult = $scope.twitter.get();
      }
    }

    $(function(){
      $('#addItem').click(function(){
           // add a row to $scope.twitterResult
      });
   });
</script>

<body>
   <div data-loading></div>
    <div ng-controller='TwitterCtrl' ng-init="doSearch()">
        <ul>
           <li ng-repeat='tweet in twitterResult.results'><p> {{tweet.text}}</p></li>
         </ul>
    </div>
</body>
4

3 に答える 3

2

より良い方法は、「シグナルハブ」をAngularJSサービスでラップすることです。AngularJSでのWebソケットの使用、特に「Socket.IOとの対話」についての私のブログ投稿をご覧ください。

なぜあなたは書いたのですか:

$(function(){
  $('#addItem').click(function(){
       // add a row to $scope.twitterResult
  });
});

そして、使用するだけではありませんng-clickか?これはサードパーティのコードまたはウィジェットですか?これらを保留している間、私はあなたにもっとよくアドバイスし、いくつかのサンプルコードを書くように努めます。

イベントハンドラーを登録する必要がある場合は、ディレクティブを使用して登録する必要があります。そうしないと、これらの角度外のイベントバインディングのライフサイクルの管理を開始するときに、事態が複雑になります。

于 2012-11-08T05:57:20.677 に答える
1

一般的な答えは次のとおりです。外部からスコープを単純に混乱させることはありません。

しかし、あなたが持っている要件は本物のものです。

したがって、必要なことを実行するには、スコープ外とスコープ自体の間の通信を確立する必要があります。

最も簡単な方法は、$ scopeをウィンドウにエクスポートし、それをいじって、外部からスコープに侵入することです。これは絶対に行わないでください。ドラゴンがいます。

スコープは内部状態を維持する必要があります。

私は正確には精通してangularいませんが、次のような効果をもたらすために何かを行うことができます。

function TwitterCtrl($scope, $resource) {
    // ...

    $('body').bind('newTweetsArrived', data) {
         // data contains the new tweets

         // the decision to accept or not new tweets is made within the control
         if (in_the_mood_to_accept_new_tweets) {
             // add new tweets to the $scope.twitterResult
         }

         // optionally notify other components that new tweets are accepted
         // so that they can adjust or whatever
         $('body').trigger('afterNewTweetsArrived');
    }

}

// you add new tweets by triggering global custom event
$(function(){
    $('#addItem').click(function(){
       $('body').trigger('newTweetsArrived', { ...here_are_the_tweets... });
    });
});
于 2012-11-07T23:15:02.623 に答える
-1

あなたはおそらくこのようなことをすることができますが、それが最良のアイデアであるかどうかはわかりません:

var myTwitterScope;
angular.module('Twitter', ['ngResource'])

function TwitterCtrl($scope, $resource){
    $scope.twitter = $resource('http://search.twitter.com/:action',
    {action: 'search.json', q: 'obama', callback:'JSON_CALLBACK'},
    {get:{method:'JSONP'}});
    $scope.doSearch = function(){
        myTwitterScope = $scope;
        $scope.twitterResult = $scope.twitter.get();
    }
}

$(function(){
    $('#addItem').click(function(){
        // add a row to $scope.twitterResult
        myTwitterScope.twitterResult.push(...); // or however you would do this.
    });
});

他の人が述べているように、これは最もクリーンなソリューションではありません。

于 2012-11-07T23:01:27.013 に答える