How update an image dynamically using data binding?

I have a main.mxml application that lays out my application, it contains a “browse and upload” button. And contains an image to view the users uploaded image like so:


    import model.myModel;
    import control.myControl;

    // Create data model
    public var model:myModel = new myModel();
    //private var scld_img:Bitmap;

    // Create control
    public var mycontrol:myControl = new myControl(mymodel);


<!-- Upload and view -->
<mx:Canvas id="upload" label="1: Upload Image">


   <mx:Label text="Upload an image: "/>
   <mx:Button id="btn"
      label="Browse and preview..."


<mx:Image id="mximg_upld"


In my myModel class I have a img_scld_bm that the browseAndUpload() function draws into after scaling it.

My intent is that my mx:Image will display the image. As shown here I’m assigning the image source="mymodel.img_scld_bm", this ends up just showing a broken image icon.

I also tried data binding, where in my myModel class I have [Bindable] var img_scld_bm. And then tried setting my mx:Image source="{myModel.img_scld_bm}" .. that didn’t seem to do anything either. All this compiles fine, no warnings. I think in this case, I’m not setting a trigger or propertyChange event to update the binding?

Can someone help me understand, or provide an example of how to correctly bind an mx:Image source to some bitmap??

How update an image dynamically using data binding?