Подтвердить что ты не робот

Angular 2 парсер выражений и директива ng-init

В принципе, я ищу способ реализовать экземпляр директивы Angular 1.x ngInit.

Я знаю об ngOnInit hook и о том, что это рекомендуемое место для кода инициализации. Я считаю директиву ngInit быстрым, декларативным способом прототипа или исправления компонента, который не должен обычно использоваться в хорошо написанном производственном коде (хотя разработчик имеет право выбрать, что лучше для него/нее).

Выполнение чего-то подобного в директиве init dummy

<p [init]="foo = 1; bar()"><p>

оценивает выражение более одного раза и вызывает

Ошибки анализа шаблона:

Ошибка Parser: привязки не могут содержать присвоения

ошибка.

В Angular 1.x это можно сделать только с помощью

$parse($attrs.init)($scope)

Как может использоваться Angular 2 парсер и, возможно, расширен для оценки выражения шаблона foo = 1; bar() при инициализации компонента?

4b9b3361

Ответ 1

Это

@Directive({ selector: '[initialize], [on-initialize]' })
class InitializeDirective {
  @Output() initialize = new BehaviorSubject();
}

и

<div initialize (initialize)="initViaMethodCall(); foo = 'init via assignment'"></div>
<ng-template initialize (initialize)="bar = 'init with no extra markup'"></template>
{{ foo }}
{{ bar }}

Ответ 2

Только обходное решение ( Демо-версия плунжера), см. estus ответ для решение

init Директива:

@Directive({
  selector: '[init]',
  inputs: ['init']
})
export class InitDir {
  init;

  ngOnChanges() {     // `ngOnInit` if you want it to run just once
    if(this.init){
      let iife = function(str){ return eval(str); }.call(this.init[0], this.init[1]);
    }
  }
}

Использование:

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2 [init]="[this, 'this.name = 1; this.bar();']">Hello {{name}}</h2>
    </div>
  `,
})
export class App {
  constructor() {
    this.name = 'Angular2 (Release Candidate!)'
  }

  bar() {
    alert('Yo Bar!');
  }
}