Copy DIV Content

<!-- 'divTarget' to Copy -->
          <div id="divTarget">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
          </div>

          <!-- Copy Action Button -->
          <button on="tap:divTarget.copy();
                      copy-success:divCopySuccess.show();
                      copy-error:divCopyError.show()">
            Copy DIV Content
          </button>

          <!-- Target to show on 'copy-success' -->
          <span id="divCopySuccess" hidden class="copy-success">Content copied!</span>
          <!-- Target to show on 'copy-error' -->
          <span id="divCopyError" hidden class="copy-error"> Error while copying! </span>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Copy DIV Content Content copied! Error while copying!

Copy INPUT Value

<!-- 'inputTarget' to Copy -->
          <input id="inputTarget" value="Sample Input Value" />

          <!-- Copy Action Button -->
          <button on="tap:inputTarget.copy();
                      copy-success:inputCopySuccess.show();
                      copy-error:inputCopyError.show()">
            Copy Input Value
          </button>

          <!-- Target to show on 'copy-success' -->
          <span id="inputCopySuccess" hidden class="copy-success">Value copied successfully!</span>
          <!-- Target to show on 'copy-error' -->
          <span id="inputCopyError" hidden class="copy-error">Error while copying!</span>

Copy Input Value Value copied successfully! Error while copying!

Copy Static Text

<!-- Copy Action Button -->
          <button on="tap:AMP.copy(text='Hello AMP!');
                          copy-success:staticTextCopySuccess.show()">
            Copy Static Text
          </button>

          <!-- Target to show on 'copy-success' -->
          <span id="staticTextCopySuccess" hidden class="copy-success">
            StaticText copied successfully!
          </span>

Copy Static Text StaticText copied successfully!

Dynamically modifying class & text based on 'eventResult'

<!-- Copy Action Button -->
          <button on="tap:AMP.copy(text='Copy static text');
                          copy-error:AMP.setState({eventResult: event.data.type});
                          copy-success:AMP.setState({eventResult: event.data.type})">
            Copy Action
          </button>

          <!-- Dynamically checking copy 'eventResult' -->
          <p hidden [hidden]="false"
                 [class]="(eventResult != 'error')?'copy-success':'copy-error'"
                 [text]="(eventResult != 'error')?'Copied!':'Error while copying!'"
          />

Copy Action