Angular 8中的字符串插值是一种单向数据绑定 技术,该技术被用于从一个打字稿码的数据传送到一个HTML模板(图)。它在大括号中使用模板表达式来显示从组件到视图的数据。字符串插值将组件中的属性值添加到HTML模板视图中。
句法:
{{ component_property }}
方法:
范例1:
app.component.html
{{ title }}
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = "GeeksforGeeks";
}
{{ title }} : {{ about }}
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = "GeeksforGeeks";
about = "Computer Science Portal for Geeks";
}
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = "GeeksforGeeks";
}
输出:
范例2:
app.component.html
{{ title }} : {{ about }}
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = "GeeksforGeeks";
about = "Computer Science Portal for Geeks";
}
输出: