angularjs – 从控制器看服务中的值
发布时间:2020-12-17 07:49:05 所属栏目:安全 来源:网络整理
导读:我创建了一个隔离业务逻辑的服务,并将其注入到需要信息的控制器中.我最终要做的是让控制器能够观察服务中的值,以便我不需要进行广播/通知或复杂的消息传递解决方案,让所有的控制器被通知数据的更改服务. 我创建了一个plnkr,展示了我正在努力做什么的基本想法
我创建了一个隔离业务逻辑的服务,并将其注入到需要信息的控制器中.我最终要做的是让控制器能够观察服务中的值,以便我不需要进行广播/通知或复杂的消息传递解决方案,让所有的控制器被通知数据的更改服务.
我创建了一个plnkr,展示了我正在努力做什么的基本想法. http://plnkr.co/edit/oL6AhHq2BBeGCLhAHX0K?p=preview 控制器是否可以监视服务的值?
你已经在做正确了即将服务推送到作用域变量中,然后将该服务作为范围变量的一部分进行观察.
这是您的工作解决方案: http://plnkr.co/edit/SgA0ztPVPxTkA0wfS1HU?p=preview HTML <!doctype html> <html ng-app="plunker" > <head> <meta charset="utf-8"> <title>AngularJS Plunker</title> <script>document.write('<base href="' + document.location + '" />');</script> <link rel="stylesheet" href="style.css"> <script src="http://code.angularjs.org/1.1.3/angular.js"></script> <script src="app.js"></script> </head> <body ng-controller="MainCtrl"> <button ng-click="start()">Start Count</button> <button ng-click="stop()">Stop Count</button> ControllerData: {{controllerData}} </body> </html> Javascript: var app = angular.module('plunker',[]); app.service('myService',function($rootScope) { var data = 0; var id = 0; var increment = function() { data = data + 1; $rootScope.$apply(); console.log("Incrementing data",data); }; this.start = function() { id = setInterval(increment,500) ; }; this.stop = function() { clearInterval(id); }; this.getData = function() { return data; }; }).controller('MainCtrl',function($scope,myService) { $scope.service = myService; $scope.controllerData = 0; $scope.start = function() { myService.start(); }; $scope.stop = function() { myService.stop(); }; $scope.$watch('service.getData()',function(newVal) { console.log("New Data",newVal); $scope.controllerData = newVal; }); }); 以下是您错过的一些事情: > $scope.$watch中的变量的顺序是错误的.它(newVal,oldVal)而不是其他方式.>因为你正在使用setInterval,这是一个异步操作,你必须让角度知道事情发生了变化.这就是为什么你需要$rootScope.$apply.>你不能看一个函数,但你可以看到函数返回的. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |