0

I'm searching a way for execute a external function in the main component of angular like this:

<head>  
  <script>
      System.import('app').catch(function(err){ console.error(err); });

      function callback(datos){
        alert("datos: "+datos);
      }
    </script>
  </head>

  <!-- 3. Display the application -->
  <body>
    <my-app [cb]="callback">loading...</my-app>
  </body>

And call this in the component like this:

import { Component,Input } from '@angular/core';

@Component({
  selector: 'my-app',
  template: '<h1 (click)="cb()">My First Angular 2 App</h1>'
})
export class AppComponent {
  @Input() cb;
}

But it doesn't work. Somebody know a way to do this?

Thanks in advance.

Dan
  • 5,836
  • 22
  • 86
  • 140
Koronos
  • 547
  • 4
  • 16

1 Answers1

0

You can't use bindings [xxx] (or (xxx)) on the root component. This only works inside Angular components.

Maybe https://stackoverflow.com/a/36997723/217408 or the answer linked to at the end might give you some ideas.

Community
  • 1
  • 1
Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • So, how can i call a external function in my components if i can't use the binding? – Koronos May 27 '16 at 16:19
  • You can for example assign the function to `window` and then pass the name like `loading...` and then get the name inside Angular like explained in http://stackoverflow.com/a/36723603/217408 and call it like `window[cb]()` – Günter Zöchbauer May 27 '16 at 16:23