I am new at angular js, and I have had a problem when trying to create an image slider. The following happens to me: When I have an array "defined and initialized" by default, the effect of the slider works fine, but when I want to initialize it from the response of a request to an api, it stops working, here the html code:
<div class="col-sm-5" >
<div class="product-images" >
<ul class="dot" ng-repeat="slide in slides2 track by slide.image">
<div class="image-imitation" >
<CENTER>
<img class="text-center" class="img-responsive" alt="" err-src="<?php echo $UrlrepositorioImagenes; ?>NO-DISPONIBLE.JPG" ng-src="{{slide.image}}" isImage width="60%" />
</CENTER>
</div>
</ul>
</div>
</div>
Code js working:
$scope.slides2 = [
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-2.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-3.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-4.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-5.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-6.JPG'}
];
$http({
method: "POST",
url: 'http://GetArticuloDet', // link UserLogin with HomeController
data: Object.toparams(myobject),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
.then(function (response){
$scope.dataArray = response.data;
},function (error){
console.log(error, 'no se puede consumir datos');
});
Non-functional js code:
$http({
method: "POST",
url: 'http://www.ecodeli.mx/ApiRest/APIPaginaWeb/v1/PaginaEcodeli/GetArticuloDet', // link UserLogin with HomeController
data: Object.toparams(myobject),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
.then(function (response){
$scope.dataArray = response.data;
$scope.slides2 = [
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-2.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-3.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-4.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-5.JPG'},
{image: $UrlrepositorioImagenes+Url.replace(/^\s+|\s+$/g, "")+'-PO-6.JPG'}
];
},function (error){
console.log(error, 'no se puede consumir datos');
});
I hope you can support me with this doubt, since I searched for and tried solutions but none of them worked for me. Greetings!