다음은 앵귤러 앱에 입력하려는 간단한 예입니다. 페이지의 다른 부분에 텍스트가 출력되는 텍스트 영역이 있으며 텍스트 영역에 줄 바꿈이 만들어지면 해당 텍스트도 전송하고 싶습니다. 나는 여기 에 주어진 대답을 시도 했지만 그 경우는 각도를 사용하지 않았고 나를 위해 작동하지 않는 것 같습니다 (사용하여 시도했지만 {{sometext.replace(/\n/g, "<br />")}}식을 깨뜨리고 식을 곱슬 머리가있는 문자열로 표시합니다. 중괄호 및 모든 것이 문제를 어떻게 고칠 수 있습니까?
var app = angular.module('SomeApp', []);
app.controller('SomeController', function($scope){
$scope.sometext = "Some text\nMore text";
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app='SomeApp'>
<div ng-controller='SomeController'>
<textarea ng-model='sometext' rows='8' cols='25'></textarea>
<p>{{sometext}}</p>
</div>
</body>위의 코드에는 두 가지 문제가 있습니다.
\nhtml 페이지에서를 새 줄로 렌더링하려고하는데 html이이를 html로 인식하지 못합니다.이를 해결하려면 \n필터를 만들어 렌더링 할 때 문자열 내의 모든를 교체해야합니다 . 아래 필터는 렌더링하려는 문자열을 대체하는 정규식 및 값 쌍의 배열을 사용합니다.
자바 스크립트
.value('HTMLIZE_CONVERSIONS', [
{ expr: /\n+?/g, value: '<br>' }
])
.filter('htmlize', function(HTMLIZE_CONVERSIONS) {
return function(string) {
return HTMLIZE_CONVERSIONS.reduce(function(result, conversion) {
return result.replace(conversion.expr, conversion.value);
}, string || '');
};
});
{{}}사용하여 ng-bind-html문자열을 html로 렌더링하십시오. 또한 문제없이 html을 올바르게 렌더링 하려면 ngSanitize모듈 을 포함해야 합니다 ng-bind-html.HTML
<p ng-bind-html="someText | htmlize"></p>
노트
HTMLIZE_CONVERSIONS배열 에 더 많은 표현식 및 값 쌍을 추가 할 수 있습니다 .
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다