Question

因此，当我将鼠标悬停在任何特定div上时，我正在尝试使用背景图像设置许多div并禁用背景图像。

DataFrame df = sqlContext.read().format("org.apache.phoenix.spark").options(phoenixInfoMap)
.load();

出于某种原因，ng-init中的myStyle永远不会获得interest.src中的实际值，而只是得到了#stross.src＆＃39;。我也试过{{interest.src}}，但这不起作用。

任何帮助表示赞赏!!

Answer 1

试试这个

<div id="interest" class="col-md-4 col-sm-6" ng-repeat="interest in vm.interestList"
   ng-style="{'background-image': 'url('+interest.src+')'}" ng-mouseenter="{}"
   ng-mouseleave="{'background-image': 'url('+interest.src+')'}">
  <button id="interestButton" class="btn btn-default btn-lg" >{{interest.interestName}}</button>
</div>

Answer 2

试试这个

var jimApp = angular.module("mainApp",  []);

jimApp.controller('mainCtrl', function($scope){
  
  $scope.interestList = [{interestName:"One", src:"img/one.png"}];
  $scope.url = function(url){
    return 'url('+url+')';
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="mainApp" ng-controller="mainCtrl">

  <div id="interest" class="col-md-4 col-sm-6" ng-repeat="interest in interestList"
     ng-init="myStyle = {'background-image': url(interest.src)}"
     ng-style="myStyle" ng-mouseenter="myStyle={}"
     ng-mouseleave="myStyle={'background-image': url(interest.src)}">
    <button id="interestButton" class="btn btn-default btn-lg" >{{interest.interestName}}</button>
  </div>
</div>

Answer 3

您必须为interest.src

插入评估的角度表达式的字符串文字而不是 ng-init="myStyle={'background-image': 'url(interest.src)'}"将其更改为ng-init="myStyle={'background-image': 'url(' + interest.src + ')'}"

通过+

注意字符串连接

以下是plnkr

ng-init中的表达不适用于ng-repeat

3 个答案: