【问题标题】:How do I search through a long list of attributes and match it to fontawesome icon?如何搜索一长串属性并将其与 fontawesome 图标匹配?
【发布时间】:2019-06-11 09:59:29
【问题描述】:

我有一个PropertyFeatureOption 模型,它的数据如下所示:

+-----+-------------------------+--------+----------+---------+-------------------------+-------------------------+
| id  | name                    | shared | exterior | amenity | created_at              | updated_at              |
+-----+-------------------------+--------+----------+---------+-------------------------+-------------------------+
| 101 | Dining Room             | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 102 | Security                | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 103 | Common Area             | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 104 | Swimming Pool           | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 105 | Automatic Gate          | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 106 | Panic Button            | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 107 | Car Port                | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 108 | Electric Generator      | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 109 | Water Pump              | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 110 | Air Conditioning        | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 111 | Cable                   | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 112 | Kitchen                 | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 113 | Security Guard          | false  | false    | false   | 2014-01-30 00:07:36 UTC | 2014-01-30 00:07:36 UTC |
| 114 | Family Room             | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 115 | Other Room              | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 116 | Patio                   | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 117 | Electronic Security     | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 118 | Garage                  | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 119 | Dish                    | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 120 | Furnished               | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 121 | Living Room             | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 122 | Canteen                 | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 123 | Telephone Lines         | false  | false    | false   | 2014-01-30 00:07:37 UTC | 2014-01-30 00:07:37 UTC |
| 124 | Restroom                | false  | false    | false   | 2014-01-30 00:07:38 UTC | 2014-01-30 00:07:38 UTC |
| 125 | Powder Room             | false  | false    | false   | 2014-01-30 00:07:38 UTC | 2014-01-30 00:07:38 UTC |
| 126 | Den/Study               | false  | false    | false   | 2014-01-30 00:07:38 UTC | 2014-01-30 00:07:38 UTC |
| 127 | Water Tank              | false  | false    | false   | 2014-01-30 00:07:38 UTC | 2014-01-30 00:07:38 UTC |
| 128 | Partitions              | false  | false    | false   | 2014-01-30 00:07:39 UTC | 2014-01-30 00:07:39 UTC |
| 129 | Fully Fenced            | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |
| 130 | Garden Area             | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |
| 131 | Ceiling Fans            | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |
| 132 | Grilled                 | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |
| 133 | Kitchen Built-in(s)     | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |
| 134 | Main Level Entry        | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |
| 135 | Unfurnished             | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |
| 136 | Barn                    | false  | false    | false   | 2014-02-27 06:31:34 UTC | 2014-02-27 06:31:34 UTC |

总共有 117 条记录。

我要做的是在Property#Show 页面上,这取决于我正在查看的property 对象上是否存在任何这些,我想显示与这些条目相关的字体真棒图标。

所以,基本上我需要硬编码这些记录的不同名称之间的链接,以及各种字体很棒的图标。

例如,如果property 有一个property_feature_option.name.eql? "Car Port"(即上表中的ID=107),我想显示fa fa-carproperty_feature_options 可以有多种映射到字体很棒的图标名称。

例如Panic Button, Security Guard & Electronic Security 可以转到fa fa-bullhorn(只是一个例子)。

我该如何处理?不太确定从哪里开始。

【问题讨论】:

    标签: ruby-on-rails ruby ruby-on-rails-3.2 font-awesome


    【解决方案1】:

    一个选项是@iGian 所说的,将它们放在哈希中。为了保持整洁,您应该将它们放入单独的命名空间中:

    module FeatureIconizer
      module_function
    
      ICONS = {
        'Car Port' => 'fa-car',
        'Panic Button' => 'fa-bullhorn',
        'Security Guard' => 'fa-bullhorn',
        ...
      }
    
      DEFAULT = 'fa-house'
    
      def icon_class(feature)
        'fa ' + ICONS.fetch(feature.name, DEFAULT)
      end
    end
    

    另一个选项,正如您在 DB 中定义的功能一样,也是在 DB 中添加图标。这样一来,您无需部署即可更改一个图标。

    【讨论】:

    • 有趣,您的意思是在该表中为Icon Name 添加一列,然后在查询属性特征时只查询该列?这是一个有趣的选择。
    • 是的。这主要取决于您是否将图标映射视为数据的一部分,以及您不会过多地使用错误 SQL 的能力。
    • 是的,这是一个非常优雅的解决方案,我更喜欢它。它适用于这个特定的应用程序。
    【解决方案2】:

    我可能会做这样的事情,我定义了一个纯 Ruby 类只是为了展示,但你可以针对 Rails 进行调整。

    class PropertyFeatureOption
      attr_reader :name
    
      ICON_MAP  = { "fa fa-car" => ["Car Port"], "fa fa-bullhorn" => ["Panic Button", "Security Guard",  "Electronic Security"] }.freeze
    
      def initialize(name)
        @name = name
      end
    
      def icon
        icon = ICON_MAP.select { |k, v| v.include? name }.keys.first || "fa fa-whathever"
        icon.to_s
      end
    
    end
    
    property_feature_option = PropertyFeatureOption.new("Panic Button")
    property_feature_option.icon #=> "fa fa-bullhorn"
    
    property_feature_option = PropertyFeatureOption.new("Not in list")
    property_feature_option.icon #=> "fa fa-whathever"
    

    【讨论】:

    • 您似乎在反向使用哈希。哈希是为了查找而设计的,所以切换键和值不是更有意义,然后您可以简单地使用ICON_MAP[name] 查找它们?
    • @DaveSlutzkin,是的,你是对的,但我想让 ICON_MAP 哈希保持简单,因为它是硬编码的。
    • 我喜欢这个建议,但对于我的特殊情况,我更喜欢@rewritten 的回答。不过感谢您的建议!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-09-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-06-23
    相关资源
    最近更新 更多