Question

如果我为src使用AngularJS变量，我很难理解为什么我的视频没有显示。如果我直接使用src =＆＃34; img / test1.mp4＆＃34;，它可以工作。如果我想在HTML中显示{{camera [0] .video}}，我有＆＃34; test1＆＃34;正确显示。谢谢你的帮助。以下是代码的一部分：

＆＃13;

app.controller('appCtrl', function($scope) {

	$scope.camera = [{
				  id: "1",
				  video: "test1"
				},
				{
				  id: "2",
				  video: "test2"
				}];
  });

＆＃13;

<div class="container-fluid" ng-controller="appCtrl">
     <video width="250" height="200" controls autoplay>
	    <source src="img/{{camera[0].video}}.mp4" type="video/mp4">
      </video>
</div>

＆＃13;

Answer 1

＆＃13;

<script>

var app = angular.module('App', [])

app.controller('appCtrl', function($scope) {
	$scope.path = "img/test1.mp4";
	$scope.changePath = function() {
		$scope.path = "img/test2.mp4";
		$scope.$apply;
	}
	
});

</script>

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="App">
	<div ng-controller="appCtrl"> 
		<div>
		  <button type="button" ng-click="changePath()">Change Video</button>
		</div>
		<div>
			 <video width="480" height="280" controls autoplay>
				<source ng-src="{{path}}" type="video/mp4">
			  </video>
		</div>
	</div>
</body>

＆＃13;

AngularJS与Chrome一起显示Mp4视频

1 个答案: