如何在AngularJS中将控制器注入另一个控制器
我是新来的Angular,试图找出如何做事情…
使用AngularJS,我如何注入一个控制器在另一个控制器中使用? 我有以下片段: var app = angular.module("testApp",['']); app.controller('TestCtrl1',['$scope',function ($scope) { $scope.myMethod = function () { console.log("TestCtrl1 - myMethod"); } }]); app.controller('TestCtrl2','TestCtrl1',function ($scope,TestCtrl1) { TestCtrl1.myMethod(); }]); 当我执行这个,我得到的错误: Error: [$injector:unpr] Unknown provider: TestCtrl1Provider <- TestCtrl1 http://errors.angularjs.org/1.2.21/$injector/unpr?p0=TestCtrl1Provider%20%3C-%20TestCtrl1 我应该甚至试图使用另一个控制器里面的控制器,或者我应该使这个服务?
如果你的意图是获取另一个组件的已经实例化的控制器,并且如果你使用基于组件/指令的方法,你总是可以从一个层次结构之后的另一个组件中请求一个控制器(一个组件的实例)。
例如: //some container component that provides a wizard and transcludes the page components displayed in a wizard myModule.component('wizardContainer',{ ...,controller : function WizardController() { this.disableNext = function() { //disable next step... some implementation to disable the next button hosted by the wizard } },... }); //some child component myModule.component('onboardingStep',{ ...,controller : function OnboadingStepController(){ this.$onInit = function() { //.... you can access this.container.disableNext() function } this.onChange = function(val) { //..say some value has been changed and it is not valid i do not want wizard to enable next button so i call container's disable method i.e if(notIsValid(val)){ this.container.disableNext(); } } },...,require : { container: '^^wizardContainer' //Require a wizard component's controller which exist in its parent hierarchy. },... }); 现在这些上述组件的使用可能是这样的: <wizard-container ....> <!--some stuff--> ... <!-- some where there is this page that displays initial step via child component --> <on-boarding-step ...> <!--- some stuff--> </on-boarding-step> ... <!--some stuff--> </wizard-container> 有很多方法可以设置require。
老答案: 您需要注入 例: app.controller('TestCtrl2','$controller',$controller) { var testCtrl1ViewModel = $scope.$new(); //You need to supply a scope while instantiating. //Provide the scope,you can also do $scope.$new(true) in order to create an isolated scope. //In this case it is the child scope of this scope. $controller('TestCtrl1',{$scope : testCtrl1ViewModel }); testCtrl1ViewModel.myMethod(); //And call the method on the newScope. }]); 在任何情况下,您不能调用TestCtrl1.myMethod(),因为您已将方法附加在$ scope上,而不是在控制器实例上。 如果你是共享控制器,那么总是更好的做: .controller('TestCtrl1',['$log',function ($log) { this.myMethod = function () { $log.debug("TestCtrl1 - myMethod"); } }]); 和消费do: .controller('TestCtrl2',$controller) { var testCtrl1ViewModel = $controller('TestCtrl1'); testCtrl1ViewModel.myMethod(); }]); 在第一种情况下,真正的$ scope是你的视图模型,在第二种情况下它是控制器实例本身。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
- WebService使用DataSetSurrogate压缩Dataset的序列化和解压
- 我的Docker容器没有IP地址.为什么?
- 5.绑定webService数据到DataGrid,设置DataGrid模板,模拟数据
- DevOps vs Docker
- scala – 解释免费monad列表与解释列表中的免费monad
- Angular 4.x HttpModule 揭秘
- JSR311让Restful WebService变简单
- scala – 如何根据类名创建一个Akka Actor
- angularjs – 如何使用ui-router获取带Params的Previous状态
- shell 学习五十一天----top 命令查看进程列表