Question

好的..我尝试过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>

Answer 1

更好的方法是将您的“信号中心”包装在AngularJS服务中。请查看我的博客文章using web sockets with AngularJS，特别是“与Socket.IO交互。”

你为什么写：

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

而不只是使用ng-click？这是第三方代码还是小部件？等待这些，我会尝试更好地建议你并编写一些示例代码。

如果必须注册事件处理程序，则应通过directive注册。否则，当您开始管理这些角度外事件绑定的生命周期时，事情会变得复杂。

Answer 2

一般答案是：你不要简单地从外面搞乱范围。

但你的要求是真实的。

因此，为了做你想做的事，你需要在范围之外和范围本身之间建立沟通。

最简单的方法是将$ 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... });
    });
});

Answer 3

你可能会做这样的事情，但我不确定这是不是最好的主意：

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.
    });
});

正如其他人所说，这不是最干净的解决方案。

从$ scope外部访问集合

3 个答案: