个人中心
gpt4 book ai didi

javascript - 样式标签中的 Angular

转载 作者：行者123 更新时间：2023-11-30 08:35:04 25 4
gpt4 key购买 nike

我想要一些动态样式来适应传入的用户徽章。它在 Rails 中工作，但想在 Angular 中做一些事情。想法？

<div ng-repeat="event in events">
<style ng-repeat="product in event.products">
  .product-id-{{ product.id }} .fa-gift { display: inline-block !important; }
  .product-id-{{ product.id }} .fa-star { display: inline-block !important; }
  .product-id-{{ product.id }} .{{ product.ticket_type }} { display: inline-block !important; }
</style>
<style ng-repeat="product in event.products" ng-if="product.ticket_type == 'golden'">
  .product-id-{{ product.id }} .{{ product.ticket_type }} { display: none !important; }
  .product-id-{{ product.id }} .icon-crown.golden { display: inline-block !important; }
</style>
<style ng-repeat="product in event.products" ng-if="product.ticket_type == 'vip'">
  .product-id-{{ product.id }} .{{ product.ticket_type }} { display: none !important; }
  .product-id-{{ product.id }} .icon-crown.golden { display: none !important; }
  .product-id-{{ product.id }} .fa-diamond.vip { display: inline-block !important; }
</style>
</div>

这目前无法解析值。

最佳答案

我不确定使用 angular 在内联样式中设置变量一定是最好的方法，但你所描述的绝对是可能的:

html

<body ng-controller="MainCtrl">
  <p>color is {{color}}!</p>
  <style>
    p {
      color: {{color}};
    }
  </style>
</body>

js

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.color = 'blue';
});

http://plnkr.co/edit/cTSqgX?p=preview

enter image description here

我怀疑您提供的示例代码存在范围界定问题

关于javascript - 样式标签中的 Angular ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32259612/

25 4 0
文章推荐： java - Cassandra 删除操作有时无法在删除后选择数据
文章推荐： java - 在 intellij 中显示流管道的推导类型
文章推荐： java - Serenity BDD 有趣的功能(按组分类)
文章推荐： machine-learning - sklearn : How to add association rules to MultinomialNB for text classification?