2016-09-17 3 views
0

JSON에서 비디오 이름을 읽고 <video> 태그의 소스에서 인쇄하려고합니다. 그러나 페이지를로드 할 때 비디오가 비어 있고 콘솔에 http://www.url.com/gallery/video/undefined이 표시되지만 "검사"를 수행하면 올바른 URL이 인쇄됩니다 ... 왜?
이는 HTML 코드입니다 :AngularJS가 비디오 URL을 정의하지 않았습니다.

<html xmlns="http://www.w3.org/1999/xhtml" ng-app="mediaReproductionApp"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Principale</title> 
    <script src="js/angular.js"></script> 
    <script src="js/angular_read_media.js"></script> 
</head> 
<body ng-controller="MediaReproductionCtrl"> 
    <div class="media_player"> 
     <video preload="metadata" ng-hide="reproductionCodeIsEmpty(item.items[0].media) == true" controls> 
      <source src="{{playVideo(item.items[0].media)}}" type="video/webm" /> 
     </video> 
    </div> 
</body> 
</html> 

그리고 이것은 스크립트입니다 데이터가 아무리 media가 처음 undefined 될 것입니다 도착하기 전에 $scope.playVideo()이 전화를받을 것입니다

var model = {}; 

var mediaReproductionApp = angular.module("mediaReproductionApp",[]); 

mediaReproductionApp.run(function ($http) { 
    $http.get("movimenti_per_totem.json").success(function (data) { 
     model.items = data; 
    }); 
}); 

mediaReproductionApp.controller("MediaReproductionCtrl", function($scope) { 
    $scope.item = model; 

    $scope.playVideo = function(media) { 
    return "../gallery/video/" + media; 
    } 

    $scope.reproductionCodeIsEmpty = function(media) { 
    return media == ""; 
    } 

}); 
+1

컴파일되지 않은 URL의 잘못된 요청을 방지하려면 'ng-src'를 사용해야합니다. 브라우저가 'src'로 실행될 때 각도 컴파일을 기다리는 것을 알지 못함 – charlietfl

+0

...'$ http'가 완료 될 때까지'media'가 함수에서 정의되지 않았습니다. – charlietfl

+0

@charlietfl 그래서, 어떻게해야합니까? – ProtoTyPus

답변

1

함수.

ng-src을 사용하고 media이 정의 될 때까지 문자열을 반환하지 않도록주의하십시오. 이러한 이유로 대신

$scope.playVideo = function(media) { 
    return media ? "../gallery/video/" + media : null; 
} 

<source ng-src="{{playVideo(item.items[0].media)}}" type="video/webm" /> 
이 는 보간 값이 ng-src 요소 상에 src을 설정하지 않습니다 입니다

때 뷰에 사용되는이 같은 것들에 대한보기 기능을 사용 범위 모델 속성을 정의하지 않는 것이 좋습니다 위장한

+0

이제 다음과 같이 출력됩니다. 그러나 지금은 내게 명령을 보여 주지만 여전히 비디오가 아닙니다 ... – ProtoTyPus

+0

은 페이지와 경로 url과 관련하여 올바른 경로입니까? – charlietfl

+0

그래, 그저 iFrame에서 작동한다는 것을 발견했습니다./ \t \t ProtoTyPus

0

시도해보십시오. 실행 방법을 호출하는 방법이 잘못되었을 수 있습니다. 그러나 HTTP 호출 중에 범위 변수를 할당 할 때 여기에서 설명하려고합니다.

mediaReproductionApp.run("**xyzw**",function ($http) { 
     $http.get("movimenti_per_totem.json").success(function (data) { 
      return data; 
     }); 
    }); 

    mediaReproductionApp.controller("MediaReproductionCtrl",function($scope,xyzw) { 


    **xyzw**.success(function(dataresult)){ 
     $scope.item = dataresult; 
    } 


     $scope.playVideo = function(media) { 
     return "../gallery/video/" + media; 
     } 

     $scope.reproductionCodeIsEmpty = function(media) { 
     return media == ""; 
     } 

    }); 
관련 문제