Question

我有简单的app，显示来自server-upload file-dispay更新列表的文件列表。我有两个控制器“上传”和“文件”在不同的div下。

我希望能够从文件中调用loadData（），以便在上传后更新我的文件列表。

更新的DOCE
app.controller（ 'myCtrl1'，函数（$ scope，$ http）{

$scope.fileupload=function()
{
$scope.loadData();
}
//load file list
$scope.loadData = function () {
$scope.fileslist = ["abc.abc", "cde.cde"];

}

}）;

HTML 已更新

 <body ng-app="myapp" nng-controller="myCtrl1">
 <div>
        <div>
        <form id="upload-form" method="post" action="">
            <input type="file" name="file"/>
            <input type="submit" value="upload" class="button" ng-click="loadData()"/>
        </form>
        </div>
</div>

<div>
<div>
<form name="myForm">
    <ul>
        <li ng-repeat="fileslist in fileslist">
            <label>
                <input type="radio" ng-model="$parent.name" name="name" value="{{fileslist}}" required />{{fileslist}}
            </label>
        </li>
    </ul>
    <button ng-disabled="myForm.$invalid" class="button">Submit</button>

当我点击上传控制器中的按钮时，我只想运行myCtrl1控制器的“loadData（）”功能

更新问题 - 我做了一个代码更改并合并了控制器，因为服务没有帮助我刷新控制器

所以现在问题是我可以加载所需的数据，为什么loadData（）但会在一秒内消失...

Answer 1

您无法从控制器内的控制器调用方法。您需要提取方法，创建服务并调用它。这也将使代码彼此分离并使其更易于测试

(function() {
angular.module('app', [])
    .service('svc', function() {
        var svc = {};

        svc.method = function() {
            alert(1);
        }

        return svc;
    })
    .controller('ctrl', [
        '$scope', 'svc', function($scope, svc) {
            svc.method();
        }
    ]);
})();

示例：http://plnkr.co/edit/FQnthYpxgxAiIJYa69hu?p=preview

如需完整参考，请点击LINK1或LINK2

希望这会对你有所帮助。

Answer 2

您可以使用$ emit和$ on方法在两个控制器之间进行通信。

app.controller('first', ['$scope', '$rootScope',
    function($scope) {
       $rootScope.$on("CallMyMethod", function(){
          $scope.mymethod();
       });

       $scope.mymethod = function() {
           // your code goes here
       }
    }
]);
app.controller('second', ['$scope', '$rootScope',
    function($scope) {
       $scope.childmethod = function() {
           $rootScope.$emit("CallMyMethod", {});
       }
    }
]);

您可以在调用$ rootScope时将数据发送到mymethod。$ emit。

Answer 3

您需要注入$controller服务来实例化另一个控制器内的控制器。

    app.controller('TestCtrl2', ['$scope', '$controller', function ($scope, $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");
    }
    }]);

从另一个控制器调用一个函数

3 个答案: