0

我有一个简单的应用程序，从服务器显示文件列表-上传文件-显示更新列表。我在不同的 div 下有两个控制器“上传”和“文件”。

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

更新
文档 app.controller('myCtrl1', function ($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() 但它会在一秒钟内消失......

4

3 回答 3

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

希望这对您有所帮助。

于 2016-04-16T10:29:50.447 回答
0

您可以使用 $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.$emit 时将数据发送到 mymethod。

于 2016-04-16T10:30:19.530 回答
0

您需要注入$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");
    }
    }]);
于 2016-04-16T10:42:26.713 回答