动态地将变量分配给对象属性

Question

I want to assign a variable to an object property.

this.dir = {
  origin : {
     lat :36.7014631
    , lng: -118.7559974
  },
  destination: { lat: 36.7014631, lng: -118.7559974}
}

The above code works fine, but what I need below does not work:

this.dir = {
  origin : {
     lat :this.la,
     lng: this.lo
  },
  destination: { lat: 36.7014631, lng: -118.7559974}
}

I need this to bind in HTML like this:

<agm-map [latitude]="lat" [longitude]="lng">
  <agm-direction *ngIf="dir" [origin]="dir.origin" [destination]="dir.destination"></agm-direction>
</agm-map>

Answer 1

<agm-map [latitude]="lat" [longitude]="lng">
  <agm-direction *ngIf="dir" [origin]="dir.origin" [destination]="dir.destination"></agm-direction>
</agm-map>

You are attempting to set lat to [latitude] yet, according to your provided code, you have not defined lat as its own variable.

You have the field:

this.dir = {
  origin : {
     lat :this.la, 
     lng: this.lo
  },
  destination: { lat: 36.7014631, lng: -118.7559974}
}

So, change your template to not access lat , because it isn't defined in your controller, but rather access dir.origin.lat :

<agm-map [latitude]="dir.origin.lat" [longitude]="dir.origin.lng">
  <agm-direction *ngIf="dir" [origin]="dir.origin" [destination]="dir.destination"></agm-direction>
</agm-map>

Or, since it looks like you have a lat & long field already do it like so:

<agm-map [latitude]="la" [longitude]="lo">
  <agm-direction *ngIf="dir" [origin]="dir.origin" [destination]="dir.destination"></agm-direction>
</agm-map>