Can't remove event listener from Image

Question

I'm clearly missing something and would appreciate some help.  I'm trying to run an event handler when an Image completes loading,  then remove the handler so that it won't  run again should the image be reloaded later.
The problem that I'm having is that the event handler simply wont' go away, despite calling removeEventListener on the Image object.
The following example demonstrates the problem (the example doesn't actually do anything useful...it's just the shortest example to demonstrate the problem).  (To run the  app, you'll have to provide any ol' JPEG file named "myImage.jpg" in the "src" directory of your project).
What I expect to happen is :
     1) on startup, the image loads and loadComplete() runs.
     2)  loadComplete removes the event Listener so that subsequent re-loads won't re-fire the handler.  I only want the handler to  run once.
     3) "loadComplete" shoudl  be displayed in the Debug console.
     4) A button click should display only "Changing  Image" in the Debug console
What I get instead is that the loadComplete handler isn't  removed, and every  time I click the button, loadComplete runs when the image is re-loaded   (i.e., every button click results in both "Change Image" AND "loadComplete"  being displayed in the Debug console).
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Image width="655" height="181" source="myImage.jpg" id="myImage" autoLoad="true" scaleContent="true" complete="loadComplete()" x="100" y="100"/>
    <mx:Button x="100" y="341" label="Button" click="click(event)"/>
    <mx:Script>
        <![CDATA[
            private function loadComplete():void
                trace ("loadComplete");
                myImage.removeEventListener("complete", loadComplete);
            private function click(evt:Event):void
                trace ("Changing Image");
                myImage.load("myImage.jpg");    //  Reload same image; it's just an example
        ]]>
    </mx:Script>
</mx:Application>

Answer 1

Hi,
You can remove only event listeners that you added with the addEventListener() method in an ActionScript block. You cannot remove an event listener  that was defined in the MXML tag, even if it was registered using a call  to the addEventListener()method that was made inside a tag attribute.
Check this page for reference.
http://livedocs.adobe.com/flex/3/html/help.html?content=events_05.html
You can modify the code a bit a get it working
<mx:Image width="655" height="181" id="myImage" scaleContent="true"
          x="100" y="100"
          creationComplete="myImage_creationCompleteHandler(event)"/>
private function myImage_creationCompleteHandler(event:FlexEvent):void
     myImage.addEventListener("complete",myImage_completeHandler);
     myImage.load("myImage.jpg");
private function myImage_completeHandler(event:Event):void
     myImage.removeEventListener("complete",myImage_completeHandler);