【问题标题】:Angular.js Controller can't set propertiesAngular.js 控制器无法设置属性
【发布时间】:2013-04-24 21:24:15
【问题描述】:

我正在使用 https://github.com/angular/angular-seed 的克隆来制作一个简单的 Angular.js 应用程序。我正在尝试向控制器添加一些属性,以便将它们绑定到我的 HTML 中,但不断收到我似乎无法弄清楚的错误消息。

我的 controllers.js 文件目前如下所示:

'use strict';

/* Controllers */

angular.module('myApp.controllers', []).
  controller('MyCtrl1', [function($scope) {
    $scope.names = 'bob'
  }])
  .controller('MyCtrl2', [function() {

  }]); 

如果有帮助,这里也是 app.js:

'use strict';

// Declare app level module which depends on filters, and services
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives',     'myApp.controllers']).
  config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller:  'MyCtrl1'});
    $routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: 'MyCtrl2'});
    $routeProvider.otherwise({redirectTo: '/view1'});
  }]);

我使用了应用程序“myApp”的默认名称,并且还在我的 HTML 中调用了 ng-view。当 MyCtrl1 正在使用时,我不断收到此错误:

TypeError: Cannot set property 'names' of undefined

这里有什么语法错误吗?我试图只修改 controllers.js 以避免出现问题,所以其他地方不应该有问题......

【问题讨论】:

    标签: html model-view-controller web angularjs


    【解决方案1】:

    控制器有一些重载,您可以将代码简化为:

    angular.module('myApp.controllers', []).
      controller('MyCtrl1', function($scope) {
        $scope.names = 'bob'
      })
      .controller('MyCtrl2', function() {
    
      }); 
    

    或者让 Angular 知道 $scope 是这样的:

    angular.module('myApp.controllers', []).
      controller('MyCtrl1', ['$scope', function($scope) {
        $scope.names = 'bob'
      }])
      .controller('MyCtrl2', [function() {
    
      }]); 
    

    参考:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_controller

    【讨论】:

    • 这里只是一个注释,我尝试使用第二个示例,(其中 $scope 在数组中被引用),但我无法让它工作,只有第一个似乎工作对我来说:S,以防其他人试图让第二个工作。
    • @onaclov2000 这可能是某个地方的拼写错误......你有没有工作的例子?它适用于最新版本:jsfiddle.net/hS9sn(相同的代码也适用于旧版本)。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-05-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多