Results 1 to 5 of 5

Thread: Button click in Angular

  1. #1
    Sencha Premium User
    Join Date
    May 2019
    Posts
    7

    Default Button click in Angular

    I have added a Button in the template with:

    <ext-button text="Test Button" ui="" shadow="true" iconCls="" arrowAlign="bottom" ></ext-button>

    How do I add the equivalent of (click)="MyEvent()"

    Help would be much appreciated.

    Kind regards

    Sean

  2. #2
    Touch Premium Member
    Join Date
    Jan 2008
    Location
    Quebec, Canada
    Posts
    137

    Default

    I have the same question but for Vue. How do we bind to events the "Vue way" ? v-on: ?
    I am used to the "handler" option in classic ExtJS but in web components how is it used ?

  3. #3
    Sencha Premium User
    Join Date
    May 2019
    Posts
    7

    Default

    I was able to get the button to work by configuring the template as:

    <ext-button
    text="Normal"
    ui=""
    shadow="true"
    iconCls=""
    arrowAlign="bottom"
    (ready)="buttonReady($event)">
    </ext-button>

    And adding the following to the component:

    buttonReady = (event) => {


    const navButton = event.detail.cmp;


    navButton.on('tap', this.log);


    }


    log = () => {


    console.log('tapped');


    }

    No doubt there is some explanation somewhere! However I have yet to find a concise introduction to the basic strategy for using the components.
    Hope this example helps.
    Regards
    Sean

  4. #4
    Sencha User photon's Avatar
    Join Date
    Oct 2010
    Location
    Argentina
    Posts
    2

    Default

    You can use "Vue way", but "ext-button" does not emit "click" event, instead it emits "tap" event that for most of case is similary.

    Example:

    <ext-button text="Here" v-on:tap="MyFunction"></ext-button>

    I guess also applies to angular

  5. #5
    Sencha Premium User
    Join Date
    May 2019
    Posts
    7

    Default

    Thank you, much simpler. That helps.
    In Angular the following worked fine:

    (tap)="buttontest()"

    Regards
    Sean

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •