我一直在尝试使用this示例,从一个控制器调用一个函数到另一个控制器。到目前为止,我的尝试都没有奏效。我目前在控制器ModalViewController中有一个带有按钮的模态视图。这个html出现了:
<script type="text/ng-template" id="renderedContent.html">
<div class="modal-header">
<h3>Detailed View</h3>
</div>
<div class="modal-body">
<ul>
<li ng-repeat="data in storage">
<button style="border-radius:5px;color:white;background-color:#777777;border:none;margin:1px;" ng-click="myFunction(data)">
<h5 style="font-size:10px;padding:0px;margin:0px;">{{data}}</h5>
</button>
</li>
</ul>
</div>
<div class="modal-footer">
<button class="btn btn-default" ng-click="cancel()">Close</button>
</div>
</script>
方法myFunction()应该在另一个控制器的范围内设置一个值。特别是,我在控制器InputController中有一个输入字段,基本上是:
<input type="text" ng-model="inputText"></input>
我正在尝试编写一个函数,以便我可以使用:
//in ModalViewController
$scope.myFunction = function(data){
// call InputController
// set InputController.inputText = data;
}
我并不完全理解给定链接中的代码。我该如何编写这个函数,以便它能够完成我想要做的事情?
答案 0 :(得分:0)
您的问题的主题正是服务和工厂服务的目的......在控制器之间共享方法(函数)和变量。您不能直接从另一个控制器调用控制器。这违反了单一目的规则。您使用服务来促进此通信。
创建服务非常简单:
angular.module('myApp').service('MyService', Myservice);
function MyService() {
var MyService = this;
MyService.someVariable = "A";
MyService.setSomeVariable = function(value) {
MyService.someVariable = value;
console.log(Myservice.someVariable);
};
}
也很容易注入你的控制器:
angular.module('myApp').controller('MyController', MyController);
MyController.$inject = ['MyService', '$scope'];
function MyController(Myservice, $scope) {
MyService.setSomeVariable("B"); // prints "B"
});
angular.module('myApp').controller('MyOtherController', MyOtherController);
MyOtherController.$inject = ['MyService', '$scope'];
function MyController(Myservice, $scope) {
MyService.setSomeVariable("C"); //prints "C"
});
该服务是 singleton ,这意味着它仅在应用程序的生命周期内实例化一次。