如何在元素上应用以下样式？

Question

我在angular2 app中有一个元素如下，

 <div class="ticket-card" [ngStyle]="{'background': 'url(' + ticketPath + ')' , 'background-size':  'cover'}">

使用上面的样式，我想添加以下样式，

background: 
    / top, transparent red / 
    linear-gradient(
      rgba(255, 0, 0, 0.45), 
      rgba(255, 0, 0, 0.45)
    )

}

Answer 1

＆＃13;

＆＃13;

var app = angular.module('App', []);
app.controller('Ctrl', ['$scope', function($scope){
  $scope.gradient = "linear-gradient(to bottom, rgba(255, 0, 0, 0.45), rgba(255, 0, 0, 1))";
}]);

＆＃13;

.box {
  width: 300px;
  height: 300px;
  background: grey;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="box" ng-app="App" ng-controller="Ctrl" ng-style="{'background': gradient}"></div>

＆＃13;

＆＃13;

＆＃13;

使用基本的角度语法将字符串插入ngStyle指令。