AngularJS错误-[$compile:multidir]多指令错误

我使用这些软件包： angularjs模式来自AngularUI包： 和从这里开始的角度flexslider：

每个插件在单独的页面中都能正常工作。但当我在一页中使用它们时，angular flexslider会导致错误：

Error: [$compile:multidir] Multiple directives [flexSlider, slide] asking for transclusion on: <div class="flexslider-container ng-isolate-scope ng-scope" slide="s in slides" animation="slide">
http://errors.angularjs.org/1.2.0-rc.2/$compile/multidir?p0=flexSlider&p1=s…20ng-scope%22%20slide%3D%22s%20in%20slides%22%20animation%3D%22slide%22%3E
    at ...

controller.js文件是：

angular.module('theApp.controllers', [])
 .controller('SliderMedium', [ '$scope', function($scope) {
   $scope.slides = [
     'images/slider/01.png',
     'images/slider/02.png',
   ];
 }]);

// ========= THIS IS controllers from angular-ui with no modification =======:
// ==========================================================================
var ModalDemoCtrl = function ($scope, $modal) {

  $scope.items = ['item1', 'item2', 'item3'];

  $scope.open = function () {

    var modalInstance = $modal.open({
      templateUrl: 'myModalContent.html',
      controller: ModalInstanceCtrl,
      resolve: {
        items: function () {
          return $scope.items;
        }
      }
    });
  };
};

var ModalInstanceCtrl = function ($scope, $modalInstance, items) {

  $scope.items = items;
  $scope.selected = {
    item: $scope.items[0]
  };

  $scope.ok = function () {
    $modalInstance.close($scope.selected.item);
  };

  $scope.cancel = function () {
    $modalInstance.dismiss('cancel');
  };
};

我怎样才能修好它？如果需要更多信息，请告诉我。谢谢

---

更新：删除不必要的html标记，添加controller.js和app.js内容。

名为

slide

的指令看起来既在

angular flexslider

中，也在

ui.bootstrap.carousel

中。如果您不需要旋转木马，请尝试在不支持旋转木马的情况下构建AngularUI引导

看起来angular使用的是boostrap

幻灯片

而不是flexslider

幻灯片

，而bootstrap one需要转换，这也是flex slider所需的，因此在哪个幻灯片获得优先权方面存在冲突

---

您也可以通过修改加载顺序来解决此问题，但我不确定。Jussi Kosunen有权这样做，但您不需要自己构建AngularUI引导。 只需在HTML中将幻灯片重命名为fslide即可

<flex-slider slide="s in slides" animation="slide">
    <li>
        <img ng-src="{{s}}">
    </li>
</flex-slider>

到

---

不要忘了在自述文件中将这些步骤留给其他贡献者。

为了避免与引导旋转木马冲突，Nikso/angular flexslider在

幻灯片

的同时添加了一个新的指令

flex slide

引导用户可以使用

flex-slide

而不是

slide

指令

<flex-slider flex-slide="s in slides" animation="slide">
    <li>
        <img ng-src="{{s}}">
    </li>
</flex-slider>

我得到了这个错误..因为我复制了一个预先制定的指令来制定一个新的指令..并且忘记了更改指令名称。

---

.directive（'addTransaction'，function（）{

很抱歉，我看不出您在哪里使用flexSlider和slide指令？这是所有的模板还是不完整？@ThomasPons很抱歉。问题已更新。文档现在指定将“flex slide”作为指令与引导UI结合使用（github.com/thenikso/angular-flexslider#用法）您是否可以添加上下文来说明这如何帮助OP？

<flex-slider slide="s in slides" animation="slide">
    <li>
        <img ng-src="{{s}}">
    </li>
</flex-slider>

<flex-slider fslide="s in slides" animation="slide">
        <li>
            <img ng-src="{{s}}">
        </li>
</flex-slider>

match = attr.slide.match(/^\s*(.+)\s+in\s+(.*?)(?:\s+track\s+by\s+(.+?))?\s*$/);

match = attr.fslide.match(/^\s*(.+)\s+in\s+(.*?)(?:\s+track\s+by\s+(.+?))?\s*$/);

<flex-slider flex-slide="s in slides" animation="slide">
    <li>
        <img ng-src="{{s}}">
    </li>
</flex-slider>