Question

我有两个JSON数据，其中一个的价格为零，另一个的价格为零。如果我选择特定的产品，则必须从JSON进行评估并在我提取第一个时显示正确的价格，如果我选择了第二个没有价格的地方，必须在那里显示一个普通按钮。我认为可以使用* ngIf仍然可以保持逻辑。

HTML 
    <h2 class="py-2 new-price">${{product?.newPrice}}</h2> 


JSON 1
    { 
        "id": 1,
        "name": "SolidWorks to Revit Exporter",
        "images": [
            {
                "small": "assets/images/products/keyboard/1-small.png",
                "medium": "assets/images/products/keyboard/1-medium.png",
                "big": "assets/images/products/keyboard/1-big.png"
            },
            {
                "small": "assets/images/products/keyboard/2-small.png",
                "medium": "assets/images/products/keyboard/2-medium.png",
                "big": "assets/images/products/keyboard/2-big.png"
            },
            {
                "small": "assets/images/products/keyboard/3-small.png",
                "medium": "assets/images/products/keyboard/3-medium.png",
                "big": "assets/images/products/keyboard/3-big.png"
            }
        ],
        "oldPrice": null,
        "newPrice": null,
        "discount": null,
        "ratingsCount": 4,
        "ratingsValue": 350,
        "description": "Revit Exporter for SolidWorks is a data exchange tool which creates Parametric Revit families/Projects from SolidWorks parts and assemblies. Exports the SolidWorks model into a BXf file, the exported BXF file is then imported into BIM/Revit platform. All parametric information including geometry, parameters, units, materials etc. will be converted. The tool supports various industry specific requirements like geometric simplification, parameter data exchange",
        "availibilityCount": 5,
        "color": ["#5C6BC0","#66BB6A","#90A4AE"],
        "size": ["S","M","L", "XL"],
        "weight": 150,
        "categoryId": 100
    }
JSON 2
    { 
        "id": 2,
        "name": "Creo to Revit Exporter",
        "images": [
            {
                "small": "assets/images/products/pc/1-small.png",
                "medium": "assets/images/products/pc/1-medium.png",
                "big": "assets/images/products/pc/1-big.png"
            },
            {
                "small": "assets/images/products/pc/2-small.png",
                "medium": "assets/images/products/pc/2-medium.png",
                "big": "assets/images/products/pc/2-big.png"
            },
            {
                "small": "assets/images/products/pc/3-small.png",
                "medium": "assets/images/products/pc/3-medium.png",
                "big": "assets/images/products/pc/3-big.png"
            },
            {
                "small": "assets/images/products/pc/4-small.png",
                "medium": "assets/images/products/pc/4-medium.png",
                "big": "assets/images/products/pc/4-big.png"
            },
            {
                "small": "assets/images/products/pc/5-small.png",
                "medium": "assets/images/products/pc/5-medium.png",
                "big": "assets/images/products/pc/5-big.png"
            },
            {
                "small": "assets/images/products/pc/6-small.png",
                "medium": "assets/images/products/pc/6-medium.png",
                "big": "assets/images/products/pc/6-big.png"
            }
        ],
        "oldPrice": 2510,
        "newPrice": 99,
        "discount": 15,
        "ratingsCount": 8,
        "ratingsValue": 800,
        "description": "Creo to Revit Exporter is a data exchange tool which creates Parametric Revit families/Projects from Creo parts and assemblies. Exports the Creo model into a Bxf file, the exported Bxf file is then imported into Revit platform. All parametric information including geometry, parameters, units, materials etc.. will be converted. The tool supports various industry specific requirements like geometric simplification, parameter data exchange",
        "availibilityCount": 3,
        "color": ["#1D1D1D","#DADADA","#597087"],
        "size": ["24''","28''","32''"],
        "weight": 9550,
        "categoryId": 100
    }

Answer 1

将||用于product?.newPrice || product2?.newPrice

Stackblitz Demo

<h2 class="py-2 new-price" *ngIf="product?.newPrice || product2?.newPrice">${{product?.newPrice || product2?.newPrice}}</h2>

<button  *ngIf="!(product?.newPrice || product2?.newPrice)">Display Button</button>

显示价格取决于Angular中的JSON数据

1 个答案: