programing

TypeScript - 각도:여러 줄의 문자열

iphone6s 2023. 4. 2. 10:06
반응형

TypeScript - 각도:여러 줄의 문자열

저는 Angular 2 초보자이고, 이 코드를 제 코드에 썼습니다.dev/app.component.ts:

import {Component} from 'angular2/core';

@Component({
    selector: 'my-app',
    template: '<h3 (click)="onSelect()"> {{contact.firstName}} {{content.lastName}}</h3>'
})
export class AppComponent {
    public contact = {firstName:"Max", lastName:"Brown", phone:"3456732", email:"max88@gmail.com"};

    public showDetail = false;
    onSelect() {
        this.showDetail=true;
    }
}

브라우저 "Max Brown is displayed"로 이동하면 동작합니다.

템플릿 부분을 다음과 같이 다른 행에 씁니다.

import {Component} from 'angular2/core';

@Component({
    selector: 'my-app',
    template: '<h3 (click)="onSelect()">
    {{contact.firstName}} {{contact.lastName}}<h3>'
})
export class AppComponent {
    public contact = {firstName:"Max", lastName:"Brown", phone:"3456732", email:"max88@gmail.com"};

    public showDetail = false;
    onSelect() {
        this.showDetail=true;
    }
}

그러나 Chrome 콘솔에서 다음 오류가 나타납니다.

Uncaught TypeError: Cannot read property 'split' of undefined

텍스트 줄 바꿈`작은 따옴표 대신 (backticks)'여러 줄에 걸쳐 있을 수 있습니다.

var myString = `abc
def
ghi`;

허용된 답변은 문자열에 \n을 추가하고 싶을 때만 기능합니다.긴 문자열에 \n을 추가하지 않고 내용을 줄바꿈으로 하는 경우에는 다음과 같이 각 행 끝에 \를 추가하십시오.

string firstName = `this is line 1 \
and this is line 2 => yet "new line" are not \
included because they were escaped with a "\"`;

console.assert(firstName == 'this is line 1 and this is line 2 => yet "new line" are not included because they were escaped with a "\"'); // true

참고 - 다음 줄(예시의 두 번째) 선두에 탭과 공백을 추가하지 마십시오.

const multiLineString = [
    "I wish, ",
    "There was a better way to do this!"
].join();

이건 어때?이것은, 새로운 행의 빈 공간을 중심으로 기능합니다.다만, 조금 읽기 어렵고, 퍼포먼스에 영향을 줄 수 있습니다.

    let myString =
      `multi${""
      }line${""
      }string`;

언급URL : https://stackoverflow.com/questions/35225399/typescript-angular-multiline-string

반응형