在$httpAngular.js之后使用jquery处理生成的DOM代码

Process generated DOM code using jquery after $http Angular.js

本文关键字：处理 代码 DOM jquery httpAngular js 之后      更新时间：2023-09-26

我有下一个问题：在我使用$http方法发出请求后，我试图通过angular访问和修改dom生成的html。

示例：

    function Player($scope, $http) {
    var $player = $(".player");
    var _this = this;
    var playing = false;
    console.log('pepe');
    // Getting Songs
    $http.get('http://www.undert.com/components/player/js/songs.json').success(function (data) {
        $scope.songs = data.songs;
        console.log($player.find('li').length);
    });
}

HTML是：

   <div class="player" ng-controller="Player">
    <ul class="playlist">
        <li ng-repeat="song in songs">
            <div class="album-art">
                <div ng-show="!song.image">
                    <img src="http://undert.com/components/player/img/album_default.jpg" alt="{song.band}" />
                </div>
                <div ng-show="song.image">
                    <img src="http://undert.com/artists/{song.namespace}/images/albums/{song.image}" alt="{song.album}" />
                </div>
            </div> <a class="reproduction"></a>
 <a class="close"></a>
 <span class="title">{song.title}</span>
 <span class="artist">{song.artist}</span>
            <audio src="http://undert.com/artists/{song.namespace}/music/{song.song}"></audio>
        </li>
    </ul>
    <div class="buttons">
        <div class="play"></div>
        <div class="prev"></div>
        <div class="next"></div>
    </div>
</div>

但当我试图在中读取我生成的代码时

<li ng-repeat="song in songs">

使用jquery我不能（它还不存在，但我试图在$http方法的"success"回调中做到这一点）。当我不使用$http并在我的Player函数中对jsqon进行硬编码时，这非常有效。

感谢

我建议您使用$timeout，如下所示：

$timeout(function(){ console.log($player.find('li').length); });

这基本上会使您的调用只在Angular完成生成新DOM结构后发生。另外，$timeout必须像$http一样注入控制器中，因此您的控制器声明应该像一样lokk

function Player($scope, $http, $timeout) {
相关文章：