Angular-ui：选项卡的备用控制器语法

Question

我试图将angular-ui引导选项卡添加到一个简单的应用程序，并且在使用不同版本的控制器定义/范围时遇到麻烦（我认为）

var app = angular.module('plunker', ['ui.bootstrap']);

// works as intended
var TabsDemoCtrl = function ($scope) {
  $scope.tabs = [
    { title:'Dynamic Title 1', content:'Dynamic content 1' },
    { title:'Dynamic Title 2', content:'Dynamic content 2', disabled: true }
  ];

  $scope.alertMe = function() {
    setTimeout(function() {
      alert('You\'ve selected the alert tab!');
    });
  };
};

// tabs are selectable, but blank
app.controller('ModifiedCtrl', function () {
  this.tabs = [
    { title:'Dynamic Title 1', content:'Dynamic content 1' },
    { title:'Dynamic Title 2', content:'Dynamic content 2' }
  ];
  this.test = 'inital test content';
});

这是我在文档中的plunkr的分支： http ://plnkr.co/edit/UekWz89tCzZnRSBnV2cs?p=preview

我已经搞砸了，但是我显然漏了一些东西……有什么建议吗？ TIA

这篇SO帖子很有帮助，但是我还没有开始工作…… angular.module.controller的替代语法

Answer 1

问题出在您的标记中。

您正在执行ng-controller="ModifiedCtrl as tabs"然后ng-repeat="tab in tabs 。因此， tabs实际上是您的控制器。您希望ng-repeat="tab in tabs.tabs"可以正常工作。