Show Div Angular2

Question

Hi guys I'm building an app with ionic2 and angular2. I want to click a button and show a div on the page containing some info loaded from the db.

I have this in my html view:

<div *ngIf="!outletBox" id="outlet-info">
    info here
</div>

So in my .js file this.outletBox is set to true on button click. I just started using angular. The variable doesn't update in the view though, and the DIV doesn't show.

I'm using a Google Maps API object and the click occurs in my .js file. The variable is set in my js file

 var marker = new google.maps.Marker({
                position: {
                    lat: parseFloat(venue.latitude),
                    lng: parseFloat(venue.longitude)
                },
                icon: icon,
                map: this.map,
                animation: google.maps.Animation.DROP
            });
            marker.addListener('click', () => {
                infoWindow.open(map, marker);
                this.outletBox = true;
            });

Perhaps theres another way to show this div? I want to load content from the db onto the div

score 0 · Accepted Answer · answered Jun 27 '16 at 04:21

Simplest way to invoke zones is to use a async behavior such as:

setTimeout( () => { this.outletBox = true; }, 0);

This will invoke a "digest" cycle.

This video explains a lot about how it works: https://www.youtube.com/watch?v=DltUEDy7ItY&index=13&list=PLOETEcp3DkCq788xapkP_OU-78jhTf68j

Show Div Angular2

1 Answers1