Question

Angular控制器不与视图对话。包含ng-app，也是ng-controller。

使用meanJS。

以下是观点：

<section ng-app="my-module" ng-controller="MyModuleController">
  <div>
    {{ costumers[0] }}
  </div>
</section>

这是控制器：

(function() {
  'use strict';

  angular
    .module('my-module')
    .controller('MyModuleController', MyModuleController);

  MyModuleController.$inject = ['$scope'];

  function MyModuleController($scope) {
    var vm = this;

    // My module controller logic
    // ...

    $scope.costumers = [{
      name: 'John Doe',
      city: 'New York'
    }, {
      name: 'Peter Griffin',
      city: 'San Francisco'
    }];

    init();

    function init() {

    }
  }
})();

Answer 1

尝试使用vm代替$scope：

function MyModuleController($scope) {
    var vm = this;

    vm.costumers = [{
      name: 'John Doe',
      city: 'New York'
    }, {
      name: 'Peter Griffin',
      city: 'San Francisco'
    }];

    init();

    function init() {

    }
  }

HTML：

<section ng-app="my-module" ng-controller="MyModuleController as vm">
  <div>
    {{ vm.costumers[0] }}
  </div>
</section>

Answer 2

将空依赖项注入器初始化为app模块，如下所示

  angular
    .module('my-module',[])
    .controller('MyModuleController', MyModuleController);

小方注。如果您希望在控制器内使用this声明变量，请避免使用scope。在html中也使用控制器作为

＆＃13;

(function() {
  'use strict';

  angular
    .module('my-module',[])
    .controller('MyModuleController', MyModuleController);

  MyModuleController.$inject = ['$scope'];

  function MyModuleController($scope) {
    var vm = this;

    // My module controller logic
    // ...

    $scope.costumers = [{
      name: 'John Doe',
      city: 'New York'
    }, {
      name: 'Peter Griffin',
      city: 'San Francisco'
    }];

    init();

    function init() {

    }
  }
})();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<section ng-app="my-module" ng-controller="MyModuleController">
  <div>
    {{ costumers[0] }}
  </div>
</section>

＆＃13;

Answer 3

失去几根头发后，我解决了这个问题。问题出在路由文件中，控制器名称中有一个简单的拼写错误。 “参数'MymoduleController'不是一个未定义的函数”，在浏览器控制台上列出，表明拼写错误。它的目的是MyModuleController，而不是MymoduleController。谢谢你的帮助，问题解决了！

这是固定的路由文件：

(function() {
  'use strict';

  //Setting up route
  angular
    .module('my-module')
    .config(routeConfig);

  routeConfig.$inject = ['$stateProvider'];

  function routeConfig($stateProvider) {
    // My module state routing
    $stateProvider
      .state('my-module', {
        url: '/my-module',
        templateUrl: 'modules/my-module/client/views/my-module.client.view.html',
        controller: 'MyModuleController',
        controllerAs: 'vm'
      });
  }
})();

角度控制器不打印变量来查看

3 个答案: