多个角度控制器

你好，一些pleeeease帮助我。我对角度很陌生。我想将两个控制器应用到我的表格。这两个控制器是在不同的模块下创建的。该模块来自npm安装。它被命名为angular-table-resize。这是下面的代码。表调整大小功能似乎不工作多个角度控制器

控制器

var app = angular.module('myApp', ['ngTableResize']); 
app.controller('AppCtrl', ['$scope',function($scope) { 


    $scope.resizeMode = "FixedResizer"; 
}]); 


var app2 = angular.module('myApp2', []); 
app2.controller('AppCtrl2', ['$scope','$http',function($scope,$http) { 
    $scope.num = -1; 
    $http.get('/enodeb').success(function(response){ 
     $scope.ue = response; 
    }); 

}]);

HTML

<!DOCTYPE html> 
<html ng-app="myApp"> 
<head> 
    <link rel="stylesheet" href="node_modules/angular-table-resize/dist/angular-table-resize.min.css"> 
    <!-- Latest compiled and minified CSS --> 
    <link rel="stylesheet" href="bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

    <!-- Optional theme --> 
    <link rel="stylesheet" href="bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 

    <meta charset ="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content= "IE=edge"> 
    <title></title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 


</head> 
<body> 
    <div ng-table="tableParams" class="container" ng-Controller="AppCtrl" style="margin-left:180px"> 
    <h1>ERIS/BUDS Mismatches</h1> 
     <table resizeable mode="resizeMode" class="table draggable sortable" id="myTable"> 
      <thead> 
       <tr> 
        <th id="colName1"><a>EnodeB</a></th> 
        <th id="colName2"><a>Product(BUDS)</a></th> 
        <th id="colName3"><a>SerialNum(BUDS)</a></th> 
        <th id="colName4"><a>Bams-ID(BUDS)</a></th> 
        <th id="colName5"><a>Product(ERIS)</a></th> 
        <th id="colName6"><a>SerialNum(ERIS)</a></th> 
        <th id="colName7"><a>Bams-ID(ERIS)</a></th> 

       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat = "device in ue"> 
        <td>{{device.enodeBname}}</td> 
        <td>{{device.productnum_buds}}</td> 
        <td>{{device.serialnum_buds}}</td> 
        <td>{{device.bamsid_buds}}</td> 
        <td>{{device.productnum_eris}}</td> 
        <td>{{device.serialnum_eris}}</td> 
        <td>{{device.bamsid_eris}}</td> 

       </tr> 
      </tbody> 


     </table> 
    </div> 

    <script src="angular-table-resize.min.js"></script> 
    <script src="jquery.min.js"></script> 
    <script type="text/javascript" src="angular.min.js"></script> 
    <script type="text/javascript" src="Controller/controller.js"></script> 
    <script src="dragtable.js"></script> 
    <script src="sorttable.js"></script> 



</body>

来源

2016-11-18 X.Xin

你不能在一个HTML元素上声明了两个控制器，但你可以做的是应用一个控制器到父元素，一个控制到一个孩子，像这样：

<div ng-controller="AppCtrl"> 
    <table ng-controller="AppCtrl2"> 
     <!-- both AppCtrl's and AppCtrl2's scopes are available here --> 
    </table> 
</div>

请注意，在您当前的代码中，您已定义主要myApp模块，然后是其他一些myApp2模块，但未将myApp2设置为主模块的依赖关系。你需要做的要么做到这一点：

var app = angular.module('myApp', ['ngTableResize', 'myApp2']);

或只是定义在同一模块上两个控制器：

angular.module('myApp') 
    .controller('AppCtrl2', ['$scope','$http',function($scope,$http) { 
    /* ... */ 
    });

来源

2016-11-18 18:04:18

谢谢大家的响应。我添加了myApp的依赖项，但之后AppCtrl停止工作。 –

你能提供一个像jsbin或plnkr的代码吗？我相信我可以更快地帮你发现这样的工作应用程序的问题:) –

谢谢。我刚刚创建了一个https://plnkr.co/edit/glLJfA2RKC3vbTSiiI8k?p=catalogue –

多个角度控制器

回答

相关问题