<input type="text" [value]="value" #name>
1. Ссылочная переменная шаблона может быть элементом DOM, компонентом Angular (инструкцией), элементом TemplateRef или даже ссылкой на веб-компонент в Angualr. шаблон , и он конкретен. Что это такое, зависит от элемента, к которому он прикреплен (без вмешательства с помощью директив) . Как и в предыдущем примере кода, name ссылочной переменной шаблона является ссылкой на элемент DOM <input> . [Рекомендация по соответствующему руководству: «Угловое руководство»]
<app-comComponent #comComponent [input]="variable"></app-comComponent>
{{ компонент.вход }}
{{ компонент.func() }} Через переменную ссылки на шаблон мы получаем ссылку на экземпляр компонента app-component , что позволяет нам легко получать доступ к членам внутри компонента app-component в шаблоне.
2. Angular присваивает значения переменным шаблона в зависимости от местоположения объявляемой вами переменной:
если вы объявляете переменную в компоненте, переменная будет ссылаться на экземпляр компонента.
Если вы объявляете переменную в стандартной разметке HTML, эта переменная ссылается на этот элемент.
Если вы объявите переменную в элементе <ng-template> , эта переменная будет ссылаться на экземпляр TemplateRef , представляющий шаблон.
Если переменная указывает имя справа, например #var="ngModel" , тогда переменная будет ссылаться на директиву или компонент с именем exportAs в элементе.
3. Использование NgForm с переменными шаблона <br/> Здесь директива NgForm демонстрирует, как ссылаться на различные значения, ссылаясь на имя директивы exportAs . В следующем примере переменная шаблона itemForm появляется в HTML три раза.
<form #itemForm="ngForm" (ngSubmit)="onSubmit(itemForm)">
<label for="name">Имя</label>
<input type="text" id="name" class="form-control" name="name" Требуется ngModel />
<button type="submit">Отправить</button>
</форма>
<div [скрытый]="!itemForm.form.valid">
<p>{{ submitMessage }}</p>
</div> * Если значение атрибута ngForm отсутствует, значением, на которое ссылается itemForm, будет элемент <form> . Com 和Directive之间的差异在于Angular 在没有指定属性值的情况下，Angular 会引用Component ，而Directive不会改变这种隐式引用（即它的宿主元素)。(还没读懂什么意思.......
и после использования NgForm itemForm становится ссылкой на директиву NgForm. Вы можете использовать ее для отслеживания значения и достоверности каждого элемента управления в форме.
По сравнению с нативной <form> Различные элементы, директива NgForm имеет атрибут form . Если itemForm.form.valid недействителен, атрибут form NgForm позволит вам отключить кнопку отправки.
Фактически, при использовании angular для записи страниц списка часто используются ссылочные переменные шаблона
.использовал:
Ссылка на метод ExecuteQuery() ngxQuery в поле ввода компонента списка. Конечно, если мы хотим использовать ссылочные переменные шаблона в ts, мы должны использовать @ViewChild и @ViewChildren — декораторы, предоставляемые нам Angular.
Мы получаем компонент ngxQuery через имя переменной шаблона в ts:
В ts вы можете напрямую вызвать метод ExecuteQuery() ngxQuery и обновить список при передаче параметров:
(Соответствующую информацию о декораторе ViewChild можно найти здесь******)
Для родительско-дочерних компонентов также можно использовать напрямую ссылочные переменные шаблона:
buGroup — это массив в bugroupSelectComponent, который передается как ссылочная переменная шаблона через метод родительско-дочерний компонент:
Получите значение дочернего компонента в родительском компоненте ts и используйте:
