【问题标题】:angularjs - passing data between controllersangularjs - 在控制器之间传递数据
【发布时间】:2014-03-14 14:02:06
【问题描述】:

我正在使用模态构建一个角度应用程序,我想在我的控制器之间传递一些数据以填充我的模态视图。

我的主控制器是 JobListCtrl,当我单击应该调用模式的链接时会触发 callReportModalData。我使用服务 reportJobModalData 来存储数据并在控制器之间传递。

var myApp = angular.module('myApp', []);


myApp.controller('JobListCtrl', ['$scope', '$element', '$http', '$log', 'reportJobModalData', function ($scope, $element, $http, $log, reportJobModalData) {

    $scope.reportJobModalData = reportJobModalData;

    $scope.callReportModal = function(test){
        reportJobModalData.test = test;
    }

}]);

myApp.service('reportJobModalData', function(){
    this.test = '';

});

我的模态控制器和指令定义如下:

myApp.controller('reportJobCtrl', function ($rootScope, $scope, $http, $log, reportJobModalData) {
    $scope.$log = $log;
    $scope.reportJobModalData = reportJobModalData;

    $scope.test = reportJobModalData.test;
    $log.info('test: ' + reportJobModalData.test);


});

myApp.directive('sjReportJobModal', ['$rootScope', '$log', '$http', 'reportJobModalData', function ($rootScope, $log, $http, reportJobModalData) {
  return {
    restrict: 'E',

    templateUrl: 'report-job-modal-tpl',

    replace: true,

    transclude: true,

    link: function (scope) {
    }
  };
}]);

我使用的模板是这个:

<div class="modal fade" id="reportJobModal" tabindex="-1" role="dialog" aria-labelledby="reportJobModalLabel" aria-hidden="true" ng-controller="reportJobCtrl">
  <div class="modal-content ease">
    <section>
      {{ reportJobModalData.test }}
    </section>
  </div>
  <div class="modal-overlay ease" data-dismiss="modal"></div>
</div>

这里的数据在模态框上正确打印。但是我无法访问控制器中的数据,即 $scope.test 是空的,因为我只在控制台上登录了 'test :'。

我做错了什么?

非常感谢您的帮助

【问题讨论】:

    标签: javascript jquery angularjs controller angularjs-directive


    【解决方案1】:

    尝试在服务变量上应用监视,当在 joblistctrl 中设置值时,您的 reportjobctrl 将被执行。

    所以把这段代码放在reportjobctrl中,让我知道结果

    $scope.$watch(function(){
    return reportJobModalData.test},
    
    function(new,old){
    $scope.test=new;
    });
    

    【讨论】:

    • 好吧,你是对的!谢谢!! $scope.test 在页面加载时被设置,所以还没有任何价值,因为没有点击链接。如何确保仅在调用模式时才设置它?
    • 仅当您调用模式时才设置reportJobModalData.test 的值,也许在您的指令的链接函数中这也会调用手表。如果有帮助,请选择作为答案。谢谢
    【解决方案2】:
    猜你喜欢
    • 2013-07-30
    • 1970-01-01
    • 2015-12-21
    • 2014-05-03
    • 1970-01-01
    • 2015-07-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多