Question

在这里仍然学习角度，经过大量研究后可以使用一些帮助。

非常简单的例子我已经去了，我只是将ng-style指令应用于body来改变背景

<body ng-app="myapp" ng-controller="mainController as main" ng-style="***need help here***">

控制器

 angular.module('mainCtrl', [])

.controller('mainController', function() {

    // set the view model as this scope
    var vm = this

    vm.slides = [
       { images: 'assets/imgs/blurred-highway.jpg' },
       { images: 'assets/imgs/night-square.jpg' }
    ]

})

我对ui.bootstrap旋转木马没有太多运气，因此我希望实现更简单的东西;只想让全屏背景每3秒无限循环更换一次幻灯片集（最终会有6-7张照片），无需额外的控制。

非常感谢帮助。

由于

Answer 1

你只需要使用$interval 请注意，为了示例，我用两种颜色替换图像：蓝色和红色。

这是HTML代码：

<body ng-app="myApp" ng-controller="mainController as main" ng-style="{'background-color': main.slide}">
   //content
  </body>

这是Javascript代码：

angular.module('myApp', [])

.controller('mainController', function($interval) {

    // set the view model as this scope
    var vm = this

    var slides = [
       'blue' ,
       'red'
    ];

    vm.slide = slides[0]; 
    $interval(function(){
      if(vm.slide == slides[0])
          vm.slide = slides[1];
      else
          vm.slide = slides[0];
    }, 3000, 0);


});

这里是相应的Plunkr。

因此，您只需要替换图像中的颜色和background-color并background-image

如何使用Angularjs的ng-style每3秒更改一次背景？

1 个答案: