Skip to content

Feat: emit the state/params in uiSrefStatus events #41

@christopherthielen

Description

@christopherthielen

This plunker shows how to respond to changes in uiSref status using the uiSrefStatus events.

https://plnkr.co/edit/PEWdPiLCYegixwdGAdb5?p=preview

@Component({
  selector: 'my-app',
  directives: [UIROUTER_DIRECTIVES],
  template: `
  <div class="nav">
    <a uiSref="hello" uiSrefActive="active" (uiSrefStatus)="updated('hello', $event)">Hello</a>
    <a uiSref="about" uiSrefActive="active" (uiSrefStatus)="updated('about', $event)">About</a>
    <a uiSref="people" uiSrefActive="active" (uiSrefStatus)="updated('people', $event)">People</a>
  </div>
  
  <ui-view></ui-view>
`})
export class App { 
  active = {
    hello: false,
    about: false,
    people: false,
  }
  
  updated(state, event) {
    console.log(state, event);
    this.active[state] = event.active;
    console.log("active states", this.active);
  }
}

It would be nice not to have to bind the sref target manually, i.e., updated($event) instead of updated('hello', $event).

We can add the sref target to the event so it can be used in a handler.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions