在视图中迭代 JSON

Question

我正在学习使用 MEAN 全栈，遇到了一个我找不到解决方案的问题。

使用 ng-repeat 迭代 JSON 对象工作得很好，但是在第三列中使用 x.url 变量根本不起作用。 URL 在第二列中正确打印。

如何在 iframe 中引用 x.url 变量？

谢谢。

<div class="jumbotron text-center">
    <table class='table table-bordered'>
        <caption>LIST OF ALL SONGS</caption>
        <thead>{{ tagline }}</thead>
        <tr ng-repeat="x in songs">
            <td>{{x.name}}</td> 
            <td>{{x.url}}</td>
            <td><iframe width="560" height="315" src={{x.url}} frameborder="0" allowfullscreen></iframe></td>
        </tr>
    </table> 
</div>

Answer 1

大多数绑定使用 $sce 来清理元素并保护您免受潜在不安全内容的侵害，如果您信任 URL，则可以使用 $sce 明确信任它

http://plnkr.co/edit/hJw5JWsteFBfiHH5d3QS

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $sce) {
  $scope.tagline = "test"
  $scope.songs = [{url: $sce.trustAsResourceUrl('http://angularjs.org'), name: 'test'}];
});

如果您信任内容，您也可以完全禁用 $sce，但是来自用户的任何内容都应视为不安全

在视图中迭代 JSON

Iterate over JSON in View

javascript

json

node.js

express

angularjs