Question

我在单独的文件中创建了一个自定义的angularjs控制器，并且调用方也在单独的文件中。但是由于某种原因，angularjs给出的错误控制器未定义。这是文件：

test_ctrl.js：

function test_ctrl($scope, $rootScope, apiSrvc, $mdDialog) {

    $scope.hide = function() {$mdDialog.hide();};
    $scope.cancel = function() {$mdDialog.cancel();};

  }

index.html：

<button id="testbutton" ng-click="openModal($event)">open modal</button>

index.js：

// Open the Modal // 
  $scope.openModal = function(ev) { 
    $mdDialog.show({
      controller: test_ctrl,  
      templateUrl: '/views/testview/testmodal.html',
      parent: angular.element($('.some_parent_class')),
      targetEvent: ev,
      clickOutsideToClose:true,
      locals: {},
      onRemoving: function (event, removePromise) {
      }
    });
  };
  //*/ 
});

testmodal.html：

<md-dialog>
    <md-dialog-content>
        testing content
    </md-dialog-content>
    <md-dialog-actions layout="row">
        <md-button ng-click="cancel()">Close</md-button>
    </md-dialog-actions>
</md-dialog>

好总结一下过程，index.html中的按钮应该打开一个角度模态对话框。因此，对于index.html中的按钮，我包含了“ ng-click =” openModal（$ event）“来触发角度事件以打开角度模态。我不知道自己缺少什么或做错了什么，但是在控制台中当我单击按钮时，我收到“” test_ctrl“未在角度中定义...”错误。我在做什么错了？

编辑绕过它的另一种方法是，将控制器定义函数与index.js包含在同一文件中，但我真的很想像modal模版位置一样，将外部控制器文件的位置包含在openModal参数中（ templateUrl：“ / views / testview / testmodal.html”）。控制器文件的位置是否有参数？

Answer 1

需要在加载index.js之前定义控制器功能定义，因此在index.html中，您需要在test_ctrl.js之前加载index.js。

更清洁的选择是将控制器功能导入index.js。

Answer 2

我将控制器放在外部文件中，并使用openModal angular方法对其进行调用。有没有一种方法可以在openModal参数中定义控制器文件的位置？

将控制器定义为模块的一部分：

<form #heroForm="ngForm">
    ...
    <button type="button" class="btn btn-default" (click)="newHero(); heroForm.reset()">New Hero</button>
</form>

在主模块中将其声明为依赖项：

angular.module("test",[])
.controller("test_ctrl",
  function test_ctrl($scope, $rootScope, apiSrvc, $mdDialog) {
    $scope.hide = function() {$mdDialog.hide();};
    $scope.cancel = function() {$mdDialog.cancel();};
})

在模式中，使用字符串调用：

angular.module("app",['test'])

有关更多信息，请参见AngularJS Developer Guide - Modules

当将其定义为模块的一部分时，我可以将该代码放入外部文件中，对吗？无需明确告知angular位置或将其包含在脚本标签中？

包含模块的文件可以按任何顺序加载（在$scope.openModal = function(ev) { $mdDialog.show({ controller: ̶t̶e̶s̶t̶_̶c̶t̶r̶l̶,̶ "test_ctrl", templateUrl: '/views/testview/testmodal.html', parent: angular.element($('.some_parent_class')), targetEvent: ev, clickOutsideToClose:true, locals: {}, onRemoving: function (event, removePromise) { } }); };之后）。当框架找到angular.js指令并构建应用程序时，将对依赖项进行整理。

有关更多信息，请参见John Papa AngularJS Style Guide - Modules

为什么angular js找不到自定义控制器

2 个答案: