Question

我有问题，改变我的滑块到角。 这里是我的代码工作：

<div id="main-img" class="main-img"> 
    <img id="img" src="image.jpg"> 
</div> 
<div id="thumb-img" class="thumb-img" > 
    <img src='image.jpg' onclick='changeImage("image.jpg");'> 
    <img src='image1.jpg' onclick='changeImage("image1.jpg");'> 
</div> 
<script> 
    function changeImage(a) { 
     document.getElementById("img").src=a; 
    } 
</script> 

当我需要角我改变它，他不工作：

<div id="main-img" class="main-img"> 
     <img id="img" ng-src="{{some.image1}}"> 
    </div> 
    <div id="thumb-img" class="thumb-img" > 
     <img ng-src='{{some.image1}}' ng-click='changeImage("{{some.image1}}");'> 
     <img ng-src='{{some.image2}}' ng-click='changeImage("{{some.image2}}");'> 
    <script> 
     function changeImage(a) { 
      document.getElementById("img").src=a; 
     } 
    </script> 

什么，我做错了什么？

Answer 1

ng-click是一个角度指令，需要您调用changeimage的函数在该控制器的范围内。我从你的代码中创建了一个工作示例，你可以在这里查看。 https://jsfiddle.net/9bz4Lwxa/112/

基本上为“angularize”它，你必须创建控制器，并添加要在点击其范围调用该方法。

的JavaScript：

angular.module('demoApp', []) 
.controller('SliderController', ["$scope",function ($scope) { 
    $scope.changeImage = function (a) { 
     document.getElementById("img").src= a; 
    }; 
}]); 

HTML：

<div ng-app="demoApp" ng-controller="SliderController"> 
    <div id="main-img" class="main-img"> 
    <img id="img" src="image1.jpg"> 
    </div> 

    <div id="thumb-img" class="thumb-img"> 
    <img src='image1.jpg' ng-click='changeImage("image1.jpg");'> 
    <img src='image2.jpg' ng-click='changeImage("image2.jpg");'> 
    </div> 

</div>