Angularjs 앱의 텍스트 형식으로 페이지 스냅 샷을 찍습니다.

Question

다음과 같은 콘텐츠가있는 웹 페이지가있는 경우 :
<ul>
<li ng-show="showthis">{{message1}}</li>
<li ng-hide="hidethis">{{message2}}</li>
<li >{{message3}}</li>
</ul>

와 i 'message'에 대한 모델을 설정합니다

$scope.message1, $scope.message2 and $scope.message3 are the text entered by user from inputbox.
$scope.showthis = 0
$scope.hidethis = 1

.

그런 다음 화면에서 div의 내용은 inputs.showthis 및 inputs.hidethis

의 값에 따라 표시됩니다.

변수에 텍스트를 표시하는 텍스트를 표시하는 방법이 있습니까?예를 들어 위의 경우에 나는 변수에 텍스트를 다음과 같이 할 것입니다.

Item1

.

기본적으로 텍스트 형식으로 페이지의 스냅 샷을 가져 와서 버튼 (텍스트)을 클릭하는 동안 단추 (텍스트)를 클릭하는 동안 내용을 메일로 저장하고 싶습니다.

위에 달성하기위한 가능한 접근법을 알려주십시오.?

Answer 1

데이터 (메시지)를 나타내는 방식으로 문제가 시작됩니다.

• message1, message2, message3 : 배열로 더 나은 이동 ...
• showthis, hidethis : 잘못된 변수 이름으로 코드를 오염시킵니다.

메시지 객체의 배열 내에 메시지를 저장합니다.

$scope.messages = [
  {text: 'Item1' , visible: false},
  {text: 'Item2' , visible: false},
  {text: 'Item3' , visible: true}
]

.

모든 메시지를 반복하고 가시적 인 메시지 만 표시

<ul>
   <li ng-repeat="message in messages" ng-show="message.visible">
      <input type="text" ng-model="message.text">
    </li>
</ul>

.

마지막으로 모든 보이는 메시지 ANS가 텍스트가 결합 된 텍스트를 보여줄 수 있습니다.

$scope.getVisible = function(){
  return $scope.messages.filter(function(msg){
    return msg.visible;
  }).map(function(msg){
    return msg.text;
  }).join(',');
}

.