Question

我想使我的代码更短，以便可读。我有多个ngIf，条件不同，列表的编号顺序不同（例如1、1.1、1.1.1）

这是我在模板端的代码

<span *ngIf="types.inputs.length > 1 && inputs.input.length > 1 && inputs.hasMultipleInput == true && inputs.hasMultipleSummaries == false && input.designSummaries.length == 1">{{in+1}}.{{inp+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length > 1 && inputs.input.length > 1 && inputs.hasMultipleInput == true && inputs.hasMultipleSummaries == true && input.designSummaries.length == 1">{{in+1}}.{{inp+1}}.{{s+1}} ({{sum.summary}})</span>
<span *ngIf="types.inputs.length > 1 && types.hasMultipleInputs == true && inputs.input.length == 1 && input.designSummaries.length == 1">{{in+1}}.{{inp+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length > 1 && types.hasMultipleInputs == false && inputs.input.length == 1 && input.designSummaries.length == 1">{{in+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length > 1 && types.hasMultipleInputs == true && inputs.input.length == 1 && input.designSummaries.length > 1">{{in+1}}.{{inp+1}}.{{s+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length > 1 && types.hasMultipleInputs == false && inputs.input.length == 1 && input.designSummaries.length > 1">{{in+1}}.{{s+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length == 1 && inputs.input.length > 1 && input.designSummaries.length > 1">{{inp+1}}.{{s+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length > 1 && inputs.input.length > 1 && input.designSummaries.length > 1">{{in+1}}.{{inp+1}}.{{s+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length == 1 && inputs.input.length > 1 && input.designSummaries.length == 1">{{inp+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length == 1 && inputs.input.length == 1 && input.designSummaries.length > 1">{{s+1}}. ({{sum.summary}})</span>
<span *ngIf="types.inputs.length == 1 && inputs.input.length == 1 && input.designSummaries.length == 1">({{sum.summary}})</span>

这将在其他专栏中重复进行，并进行一些附加插值，而我只是不想在整个项目中使用此长代码。

我只想要你们的任何建议：）

My code on stackblitz

Answer 1

您可以使用ngSwitch，执行函数以返回ngSwithcase值

`

<div [ngSwitch]="hero?.emotion">
  <app-happy-hero    *ngSwitchCase="'happy'"    [hero]="hero"></app-happy-hero>
  <app-sad-hero      *ngSwitchCase="'sad'"      [hero]="hero"></app-sad-hero>
  <app-confused-hero *ngSwitchCase="'app-confused'" [hero]="hero"></app-confused-hero>
  <app-unknown-hero  *ngSwitchDefault           [hero]="hero"></app-unknown-hero>
</div>

https://angular.io/api/common/NgSwitch

Answer 2

您应该将所有逻辑放入一个方法（假设为public class PlayerCamera : MonoBehaviour { public float mouseSensitivity = 10f; public Transform target; public float dstFromTarget = 2f; public Vector2 pitchConstraints = new Vector2(-20f, 85f); public float rotSmoothTime = .12f; Vector3 rotSmoothVel; Vector3 currRot; float yaw; float pitch; void LateUpdate() { yaw += Input.GetAxis("Mouse X") * mouseSensitivity; pitch -= Input.GetAxis("Mouse Y") * mouseSensitivity; pitch = Mathf.Clamp(pitch, pitchConstraints.x, pitchConstraints.y); currRot = Vector3.SmoothDamp(currRot, new Vector3(pitch, yaw), ref rotSmoothVel, rotSmoothTime); transform.eulerAngles = currRot; transform.position = target.position - transform.forward * dstFromTarget; } public void ResetCamera(Transform lookAtTarget) { transform.LookAt(lookAtTarget); // below gets yaw and pitch values that move the camera to look at the // wrong location // yaw = transform.eulerAngles.x; // pitch = transform.eulerAngles.y; // pitch = Mathf.Clamp(pitch, pitchConstraints.x, pitchConstraints.y); // currRot = new Vector3(pitch, yaw); } }），该方法返回所需的getNumberingOrder()，并简单地显示为：string。 / p>

当然，您将向该函数传递参数。

比多个ngIf更好的方法

2 个答案: