Javascript 指令中控制器的问题

Javascript 指令中控制器的问题,javascript,angularjs,angularjs-directive,angularjs-scope,isolate-scope,Javascript,Angularjs,Angularjs Directive,Angularjs Scope,Isolate Scope,我正在尝试更新一个小型个人项目中的一些代码,该项目使用angular来符合更好的实践,我听说angular的未来可以通过在指令的控制器中加入大量功能来模拟。我不确定我的理解是否正确,但这似乎是一种组织代码的干净方法 无论如何,要说到我的问题所在,当我给指令一个控制器时,我似乎无法让隔离作用域工作。我一直在用谷歌搜索我的大脑,试图找出问题所在,我看到了很多关于它的话题,但没有一个解决了我的问题 下面是一个代码片段: angular.module('myCongresspersonApp') .

我正在尝试更新一个小型个人项目中的一些代码,该项目使用angular来符合更好的实践,我听说angular的未来可以通过在指令的控制器中加入大量功能来模拟。我不确定我的理解是否正确,但这似乎是一种组织代码的干净方法

无论如何,要说到我的问题所在,当我给指令一个控制器时,我似乎无法让隔离作用域工作。我一直在用谷歌搜索我的大脑,试图找出问题所在,我看到了很多关于它的话题,但没有一个解决了我的问题

下面是一个代码片段:

angular.module('myCongresspersonApp')
  .directive('congressPersonPane', function () {

    var controller = [function() {

    }];

    return {
      templateUrl: 'app/congressPersonPane/congressPersonPane.html',
      restrict: 'EA',
            scope: {
                congressPerson: '=info'
            }//,
      // controller: controller,
      // controllerAs: 'paneCtrl',
      // bindToController: true
    };
  });
这实际上只是在我移动功能之前进行测试的一种方法,但是当我取消注释这些行时,我不再有权访问我传入的隔离范围,通过它访问的所有数据都消失了,它是ng repeat中的数组对象

我在一个指令中也遇到了类似的问题,它位于这个指令中。这个问题让我更加困惑,因为如果我在$scope下定义一个方法,我可以正确地使用它,但是当我使用controllerAs时,我不能使用那个方法。所以,当我拉动这个实现以从下面Lauren提到的范围中删除范围时,我感到非常困惑

下面是代码:

'use strict';

angular.module('myCongresspersonApp')
  .directive('voteRecord', function () {

        var controller = ['$scope', 'sunlightAPI', function ($scope, sunlightAPI) {
            var voteCtrl = this;
            voteCtrl.voteInfo = [];
            voteCtrl.test = 'Test';
            voteCtrl.pageNumber = 1;
            voteCtrl.repId = '';
            console.log('inside controller definition');

            voteCtrl.getVotingRecord = function(repId) {
              console.log('inside method');
              voteCtrl.repId = repId;
              var promiseUpdate = sunlightAPI.getVotes(repId, pageNumber);
              promiseUpdate.then(function(votes) {
                console.log('fulfilled promise');
                voteCtrl.voteInfo = votes;
                console.log(voteCtrl.voteInfo);
              }, function(reason) {
                console.log('Failed: ' + reason);
              }, function(update) {
                console.log('Update: ' + update);
              });
      };

      voteCtrl.nextPage = function() {
        voteCtrl.pageNumber++;
        voteCtrl.getVotingRecord(voteCtrl.repId, voteCtrl.pageNumber);
      };

      voteCtrl.previousPage = function() {
        voteCtrl.pageNumber--;
        voteCtrl.getVotingRecord(voteCtrl.repId, voteCtrl.pageNumber);
      };

        }];

    return {
      restrict: 'EA',
      scope: {
        repId: '=representative'
      },
      controller: controller,
      contollerAs: 'voteCtrl',
            bindToController: true,
      templateUrl: 'app/voteRecord/voteRecord.html',
    };
  });
我不确定这个问题是否与这个问题有关,但它们似乎相似。任何对资源有帮助的帮助或指导都将非常感谢,因为我不想在我的约定不断变化的地方编写代码,因为我不完全理解为什么有一件事是有效的


谢谢

我不确定是否完全理解您的问题所在,但听起来您在从控制器访问$scope时遇到了问题。实际上,您可以将作用域传递给控制器,如下所示:

angular.module('myCongresspersonApp')
  .directive('congressPersonPane', function () {

    var myController = function($scope) {
      // use $scope in here
    };

    return {
      templateUrl: 'app/congressPersonPane/congressPersonPane.html',
      restrict: 'EA',
      scope: {
        congressPerson: '=info'
      },
      controller: ['$scope', myController]
    };
  });

博客文章详细介绍了如何在指令中使用控制器。此外,角度文档也将解释更多内容。祝你好运

我刚刚更新了我的帖子,所以它更清晰一点。我实际上是想删除$scope并使用controllerAs我实际上使用了你链接的网站来解决这个问题,但显然我不是做错了什么,就是不是100%正确。当我不使用controllerAs而使用$scope时,一切都正常。我明白了。您是否可以将代码发布到JSFIDLE或任何东西中?我对controllerAs不太熟悉,但通过谷歌搜索,它看起来将取代$scope。您的代码将在voteCtrl.nextPage和voteCtrl.previousPage定义处中断,因为您在var控制器定义的范围之外定义了它们。似乎解释得很好。在控制器定义中,可以使用此关键字访问范围。希望这有帮助!这些方法都在控制器中,但是奇怪的制表符/空格不一致使其在堆栈溢出编辑器中显得奇怪。使用“]”来指示其结束位置。我感谢你的帮助,但在我来问这个问题之前,我已经阅读了你发布的所有内容。如您所见,我已经设置了var voteCtrl=this;在我的控制器的开头,这只是保持控制器和html模板之间一致性的一种方法,html模板将使用controllerAs中定义的控制器的相同名称。谢谢你的帮助。