简体   繁体   English

AngularJS,共享数据服务多次触发

[英]AngularJS, share data service triggered multiple times

I faced with problem of multiple triggering share data service in my app and now I will try to explain it. 我在我的应用程序中遇到了多个触发共享数据服务的问题,现在我将尝试对其进行解释。

On the home page with controller 'home' user can select one of three menu items, after user has selected one of the item (for example the first one), he is redirecting to this view, with its own controller 'table'. 在带有控制器“主页”的主页上,用户可以选择三个菜单项之一,在用户选择其中一个菜单项(例如第一个菜单项)之后,他将使用其自己的控制器“表”重定向到该视图。 The view has a table and tabs on the bottom, each of this tab has own controller 'tab1 and etc'. 该视图的底部有一个表格和选项卡,每个选项卡都有自己的控制器“ tab1等”。 By click on row I'm sharing the id of this row between tabs' controllers, that tabs could load content related with this particular row. 通过单击行,我可以在选项卡的控制器之间共享该行的ID,这些选项卡可以加载与此特定行相关的内容。 For now everything works well. 目前,一切正常。

Next, when user clicks on button home, he is redirecting to home page and if he clicks on item (for example the first one) again, the shared services will triggered twice and will return the same id twice, for third time share service will triggered 3 times and etc. 接下来,当用户单击主页按钮时,他将重定向到主页,如果再次单击项目(例如第一个按钮),则共享服务将触发两次并返回相同的ID两次,第三次共享服务将触发3次等

Below my code, I appreciate if somebody could explain me, what I'm missing. 在我的代码下面,我很高兴有人能向我解释我所缺少的内容。 Thanks in advance. 提前致谢。

  app.controller('table', [
      '$scope', 'tab1ID', 'tab2ID', 'tab3ID'
        function ($scope, tab1ID, tab2ID, tab3ID) {

             $scope.rowSelection($scope, function (row) {

                    tab1ID.setId(row.id);
                    tab2ID.setId(row.id);
                    tab3ID.setId(row.id)

                });

  app.controller('tab1', [
      '$scope', 'tab1ID', dataService
        function ($scope, tab1ID, dataService) {

         tab1ID.getId().then(null, null, function (id) {

// return increment count of 'id' after redirecting from home view to table view
// dataService firing for each incremented id (1 for 1, 2 for 2 and etc)

            dataService.rowData(id)
                .then(function (res) {

                $scope.data = res;

            })
       });

  .factory(
        'tab1ID', function ($q) {

            var self = this,
                defer = $q.defer();

            this.share = '';

            return {
                getId: function () {
                    return defer.promise;
                },
                setId: function (id) {

                    self.share = id;
                    defer.notify(self.share);
                }
            }
        }
    );

So finally I figured out how to beat multiple triggering. 所以最后我想出了如何克服多重触发的方法。 I added declared a new variable for upcoming id and set angular watch to follow for changes in that variable. 我为即将到来的id添加了一个声明的新变量,并设置了角度监视以跟踪该变量的更改。 Probably this is ugly method, but it works for me 可能这是丑陋的方法,但对我有用

   tab1ID.getId().then(null, null, function(id){
        $scope.id = id
    });

    $scope.$watch('id', function (newVal, oldVal) {

        if (typeof newVal !== 'undefined') {

             dataService.rowData(id)
                .then(function (res) {

            $scope.data = res;
        })
   }) 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM