javascript - angular.js TypeError : $(. ..).owlCarousel 不是函数

Question

我正在使用 Angular js 和 data-ng-repeat 来获取数据。 下面是我的 HTML。

      <div id="newsslide" class="owl-carousel owl-theme">
          <div class="item darkCyan" data-ng-repeat="items in NewsList">
                        Hello
          </div>
      </div>

这是我的 JS

    $scope.getNewsList = function (Id) {
    var getData = HomeService.getNewsList(Id);
    getData.then(function (_result) {
        $scope.getMediaList(Id);
        if (_result.data.length > 0) {
            $scope.NewsList = _result.data;
            $scope.NewsNoRecords = false;
            $timeout(function () {
                $("#newsslide").owlCarousel({
                    items: 3,                        
                    nav: false,
                    dots: true,
                    rtl:true,
                    // autoPlay: 3000,
                    navText: [
                    "<i class='fa fa-angle-left'></i>",
                    "<i class='fa fa-angle-right'></i>"
                    ]
                });
            }, 1000);
        }
        else {
            $scope.NewsNoRecords = true;
        }
    }, function (errorMsg) {
        $scope.loadingDataEntryList = false;
        console.log('Error in getting records - ' + JSON.stringify(errorMsg))
    });
}

数据绑定(bind)良好。但它显示

TypeError: $(...).owlCarousel is not a function.

我还尝试通过在 Chrome 开发者控制台中粘贴来运行 $("#newsslide").owlCarousel({}); 。我收到错误

Uncaught TypeError: $(...).owlCarousel is not a function at Anonymous:1:18.

下面是我添加的库序列，[jQuery 库位于此图像之前的 head 标记中。这就是为什么它会引起问题] [ ] 1

我已经搜索了很多。请帮忙。谢谢

Answer 1

这些可能是潜在的原因。

1. 您似乎还没有添加 Jquery
   
2. 或者在Angularjs之后添加Jquery
3. 尚未添加“owl carousel”JS文件

您需要在 angularjs 之前添加 jquery。

<script src="jquery.min.js"></script>
<script src="angular.min.js"></script>