javascript - 从另一个 Controller 调用 Angular Controller

Question

我正在开发 angularjs 应用程序。我的 js 中有多个 Angular Controller 。我想从另一个 Angular Controller 调用 Angular Controller 。 请找到下面的代码。我想通过从 myControllerTwo 传递 sid 和 zone 值来从 myControllerTwo 调用 myControllerOne。任何建议都会有所帮助。

app.controller('myControllerOne',function($rootScope,$scope,$uibModal,MyTestService,sid,zone)  {
        //MyTestService.getResults() hits the backend code and get the results
        MyTestService.getResults(sid,zone).then(
            function(response) {
                $scope.responseData = response;
                //logic
                //
            })
    });

app.controller('myControllerTwo', function ($rootScope,$scope,$uibModal,MyTestService) {
   function loadData() {
        MyTestService.getServiceDataResults().then(
            function (response) {
               var cb = function(start, end, label) {
                   var sid = response.sid;
                   var zone = response.zone;
                      $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
                     //i want to call myControllerOne here by passing sid and zone values for this controller
                }
                var optionSet1 = {
                    startDate: moment().subtract(1, 'days'),
                    endDate: moment().subtract(1, 'days'),
                    minDate: minDate,
                    maxDate: maxDate,
                    dateLimit: {
                        days: 60
                    },
                    showDropdowns: true,
                    showWeekNumbers: true,
                    timePicker: false,
                    timePickerIncrement: 1,
                    timePicker12Hour: true,
                    ranges: {
                        'Today': [moment(), moment()],
                        'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                        'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                        'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                        'This Month': [moment().startOf('month'), moment().endOf('month')],
                        'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
                    },
                    opens: 'left',
                    buttonClasses: ['btn btn-default'],
                    applyClass: 'btn-small btn-primary',
                    cancelClass: 'btn-small',
                    format: 'MM/DD/YYYY',
                    separator: ' to ',
                    locale: {
                        applyLabel: 'Submit',
                        cancelLabel: 'Clear',
                        fromLabel: 'From',
                        toLabel: 'To',
                        customRangeLabel: 'Custom',
                        daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
                        monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
                        firstDay: 1
                    }
                };

                $('#reportrange span').html(moment().subtract(1, 'days').format('MMMM D, YYYY') + ' - ' + moment().subtract(1, 'days').format('MMMM D, YYYY'));

                $('#reportrange').daterangepicker(optionSet1, cb);

                $('#reportrange').on('show.daterangepicker', function() {
                     console.log("show event fired");
                });
                $('#reportrange').on('hide.daterangepicker', function() {
                     console.log("hide event fired");
                });
                $('#reportrange').on('apply.daterangepicker', function(ev, picker) {
                    console.log("apply event fired, start/end dates are " + picker.startDate.format('MMMM D, YYYY') + " to " + picker.endDate.format('MMMM D, YYYY'));
                });
                $('#reportrange').on('cancel.daterangepicker', function(ev, picker) {
                    console.log("cancel event fired");
                });
            })

    }
     loadData();
});

Answer 1

如果您需要在不同的 Controller 之间传递值，请考虑使用服务来保存共享数据，然后将其作为依赖项注入(inject)到两个 Controller 中。

此外，如果您希望在一个 Controller 中的某个功能在另一个 Controller 中可用，则应将该功能提升到一项服务中。在您的示例中，不是使用 myControllerTwo 来操纵您的服务返回的响应，而是在服务内操纵响应，然后返回处理后的数据。您甚至可以缓存处理后的数据，以便 myControllerOne 可以随时通过调用 MyTestService.getResults(sid,zone) 访问它。 MyTestService 然后可以检索结果并将其返回给 Controller ，所有这些都不会使一个 Controller 成为另一个 Controller 的依赖项。

您可以 access a parent controller from a child controller通过组件的 require 属性，但老实说，这应该避免，因为它与组件紧密耦合，并可能在以后导致麻烦。