Угловые 2 внешних входа

Пожалуйста, помогите? Только начиная с Angular 2 и имея следующую проблему.

Мой компонент ниже:

@Component({ selector: 'myapp', inputs: ['mynumber'] }) @View({ template: `

The next number is {{ mynumber + 1 }}

' }) export class App { mynumber: number; } bootstrap(App);

Внутри моего HTML:

  

Но при запуске я получаю следующее:

Следующее число – NaN

Это выглядит просто, но я чего-то не хватает. То, что я пытаюсь достичь, – это передать значение извне приложения в него.

Благодарю.

Вы не можете указать привязки свойств (входы) для корневого компонента вашего приложения. Если вы действительно хотите указать некоторые привязки для него, вы должны использовать дополнительный компонент. Посмотрите на этих плунжеров .

 import {Component, Input} from 'angular2/angular2' @Component({ selector: 'myapp', template: ` 

The next number is {{ mynumber + 1 }}

` }) class App { @Input() mynumber: number; } @Component({ selector: 'root', directives: [App], template: ` ` }) export class Root {}

Обходной путь – это чтение его непосредственно с помощью ElementRef :

 constructor(elementRef:ElementRef) { console.log(elementRef.nativeElement.getAttribute('someattribute'); } 

и использовать его как

  

См. Также https://github.com/angular/angular/issues/1858

Обновите ответы, используя ElementRef: вместо этого используйте Renderer.selectRootElement. Любой, кто пытается использовать ElementRef.nativeElement, вероятно, видит различные предупреждения о том, как это последнее средство и т. Д. Вот модифицированная, более безопасная версия.

 constructor( renderer: Renderer ){ let rootElement = renderer.selectRootElement('app-root'); this.whateverInput = rootElement.getAttribute('my-attribute'); } 

Для тех, кто использует угловой 4: если вы решили использовать его как атрибут

   

Вы можете просто использовать аннотацию @Attribute следующим образом:

 class Component { constructor(@Attribute('attributeName') public param:String){ /** some process with your injected param **/ } } 

Протестировано и успешно работало в моем приложении.

Найден там путь: https://gillespie59.github.io/2015/10/08/angular2-attribute-decorator.html

  • Почему мы используем оператор «?» В привязке шаблона в угловом 2
  • Доступ к firebase.storage () с помощью AngularFire2 (Angular2 rc.5)
  • Угловой фильтр 2 / список поиска
  • Передача данных в дочерние компоненты маршрутизатора-выхода (угловые 2)
  • Как очистить кеш шаблонов?
  • Angular2 - как вызвать функцию компонента извне приложения
  • Как получить элемент dom в угловом 2
  • угловое2 наблюдаемое, получение неопределенного в компоненте
  • Что альтернатива угловым.копиям в угловом
  • Угловая 2 | Директивы Аргумент типа '{}' не присваивается
  • Угловое ИСКЛЮЧЕНИЕ: Нет провайдера Http
  • Давайте будем гением компьютера.