Javascript 如何显示不同的文本布尔json_Javascript_Json_Angular_Typescript

Javascript 如何显示不同的文本布尔json

javascript json angular typescript

Javascript 如何显示不同的文本布尔json,javascript,json,angular,typescript,Javascript,Json,Angular,Typescript,在我的json文件中，我有布尔值，我想显示不同的文本，如果它是真的或假示例：如果为true，则在html中显示“是”，否则显示“否” 我希望我是清楚的多谢各位 json.file { "boatType": "Semi-rigide", "img": "/assets/img/boat-img/semi-rigide.jpg", "longeur&quo

在我的json文件中，我有布尔值，我想显示不同的文本，如果它是真的或假示例：如果为true，则在html中显示“是”，否则显示“否”

我希望我是清楚的

多谢各位

json.file

 {
        "boatType": "Semi-rigide",
        "img": "/assets/img/boat-img/semi-rigide.jpg",
        "longeur": 10,
        "largeur": 20,
        "tirantEau": 50,
        "equipage": false,
        "annexe": true
    },

组件。ts

export class TableComponent implements OnInit {

  user: IBoat[] = [];

  constructor(private boatService: BoatService) { }

  ngOnInit(): void {
    this.boatService.getBoat()
      .subscribe(data => {
        this.user = data
      });
  }
}

html

 <tbody>
        <tr *ngFor="let boat of user">
            <td data-label="img"><img [src]="boat.img" alt="boat" class="img"></td>
            <td data-label="longeur">{{boat.longeur}} cm</td>
            <td data-label="largeur">{{boat.largeur}} cm</td>
            <td data-label="tirant d'eau">{{boat.tirantEau}} cm</td>
            <td data-label="equipage">{{boat.equipage}}</td>
            <td data-label="annexe">{{boat.annexe}}</td>
        </tr>
    </tbody>


{{boat.longeur}}cm
{{boat.largeur}}cm
{{boat.tirantEau}}cm
{{船.装备}
{{船.附件}

首先在json文件中创建一个名为jsonData的变量：

jsonData =  {
        "boatType": "Semi-rigide",
        "img": "/assets/img/boat-img/semi-rigide.jpg",
        "longeur": 10,
        "largeur": 20,
        "tirantEau": 50,
        "equipage": false,
        "annexe": true
    }

然后在头部的脚本标记中引用json文件

<head>
<!-- Other code -->
<script src="file.json">
 
</head>

现在，您似乎对这一部分有点模糊，您正在检查哪个变量是否为真/假，因此我将为这两个布尔值提供代码

parsed.equipage ? console.log("yes") : console.log("No")
// other code
parsed.annexe ? console.log("yes") : console.log("no")

如果您想直接更改页面上元素的文本，只需执行以下操作

document.getElementById("id").innerText = "Yes"

如果愿意，可以替换为

console.log（）

如果我误解了这个问题，就说

希望这个答案对您有所帮助：）

尝试将

{{boat.annexe}}

更改为

{{boat.annexe？“是”：“否”}

document.getElementById("id").innerText = "Yes"