Question

我不完全确定如何运行与更新网页同步的功能。

如果选中，我有一个运行功能的复选框。

HTML：

<input type="checkbox" value="data.id" id="status" ng-model="data.status" class="Form-label-checkbox" ng-change="IfCheck(data.Url)">

IfCheck函数将url添加到数组$ scope.ids

中

JavaScript：//种类的伪代码

$scope IfCheck(url){
    $scope.ids.push(object);}

$scope.Playall = function(){
    var audioElements = document.getElementsByTagName("audio");
    for(var i = 0; i < audioElements.length; i++){
        audioElements[i].play();
    }
}

到目前为止，这似乎运作良好。数组ID会动态填充URL。然后，我在这个数组上运行ng-repeat，并创建一个元素，其中source作为url。这也有效。

HTML：

<div ng-repeat="data in ids">
<audio controls>
                    <source src="{{data.Url | trustUrl}}" id = "Synth.wav" type="audio/mpeg">
                    Your browser does not support the audio element.
                    </audio> </div>

我现在的问题是这个。让我说我检查两个盒子，并动态创建两个音频播放器。如果我点击播放按钮，他们会播放音乐。有没有办法以某种方式制作一个按钮，以便它可以同时播放它们？我想到了像

这样的东西

<button ng-click = "Playall()"> Playall </button>

但我不确定如何编写函数来“链接”到创建的元素。

Answer 1

$scope.Playall = function(){ Array.from(document.getElementsByTagName("audio")).forEach(audio => audio.play()); }函数可能如下所示：

$scope.Playall = function(){
    var audioElements = document.getElementsByTagName("audio");
    for(var i = 0; i < audioElements.length; i++){
        audioElements[i].play();
    }
}

OR：

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
    <xsl:output method="xml" indent="yes" />

    <xsl:template match="/Integration">
      <Integration>
        <xsl:apply-templates />
      </Integration>
    </xsl:template>

    <xsl:template match="ProtectionOrder[Deleted = 'true']">
      <ProtectionOrderStatus>
        <ProtectionOrderStatusCode>DELETED</ProtectionOrderStatusCode>
      </ProtectionOrderStatus>
    </xsl:template>

</xsl:stylesheet>

将音频元素链接在一起HTML / AngularJS

1 个答案: