why wow-slider library does not work with angular?

时间:2016-04-25 09:20:45

标签: javascript jquery angularjs

i tried many time to run this code but every time it appear in a bad manner i want angular make its affect like this demo http://wowslider.com/angular-slider-collage-demo.html. please help me i tried many time without good result.can you put aworked link to this demo

Blockquote

<!DOCTYPE html>
<html ng-app="myapp">
   <head>
      <title>Http://wowslider.net/</title>
      <meta http-equiv="content-type" content="text/html; charset=utf-8" />
      <meta name="description" content="Made with WOW Slider - Create beautiful, responsive image sliders in a few clicks. Awesome skins and animations. Http://wowslider.net/" />
      <!-- Start WOWSlider.com HEAD section --> <!-- add to the <head> of your page -->
      <link rel="stylesheet" type="text/css" href="engine1/style.css" />
      <script type="text/javascript" src="engine1/jquery.js"></script>
      <!-- End WOWSlider.com HEAD section -->
   </head>
   <body style="background-color:#d7d7d7;margin:0" >
      <!-- Start WOWSlider.com BODY section --> <!-- add to the <body> of your page -->
      <div id="wowslider-container1" >
         <div class="ws_images" ng-controller="HelloController">
            <ul>
               <li ng-repeat="img in allimages"><img ng-src="data1/images/{{img.name}}" alt="2016-chevrolet-cruze-spied-completely-uncovered-news-car-and-driver-photo-658949-s-217x132" title="2016-chevrolet-cruze-spied-completely-uncovered-news-car-and-driver-photo-658949-s-217x132" id="wows1_0"/></li>
            </ul>
         </div>
         <div class="ws_bullets">
            <div>
               <a ng-repeat="img in allimages" href="#" title="2016-chevrolet-cruze-spied-completely-uncovered-news-car-and-driver-photo-658949-s-217x132"><span><img ng-src="data1/tooltips/{{img.name}}" alt="2016-chevrolet-cruze-spied-completely-uncovered-news-car-and-driver-photo-658949-s-217x132"/>1</span></a>
            </div>
         </div>
         <div class="ws_script" style="position:absolute;left:-99%"><a href="http://wowslider.net">http://wowslider.net/</a> by WOWSlider.com v8.7</div>
         <div class="ws_shadow"></div>
      </div>
      <!-- End WOWSlider.com BODY section -->
      <script type="text/javascript" src="engine1/angular.js"></script>
      <script>
         angular.module("myapp", [])
                .controller("HelloController", function($scope) {
                    $scope.allimages = [{name:'2016chevroletcruzespiedcompletelyuncoverednewscaranddriverphoto658949s217x132.jpg'},{name:'2016chrysler300srtspieditsalivenewscaranddriverphoto658864s217x132.jpg'}];

                });
      </script>
      <script type="text/javascript" src="engine1/wowslider.js"></script>
      <script type="text/javascript" src="engine1/script.js"></script>
   </body>
</html>

0 个答案:

没有答案